<template>
    <div class="internalControl-reimbursement-content-box-v">
        <div style="width: 80%;margin: 8px auto 8px auto;">
            <a-steps labelPlacement="vertical" :current="currentSteps" size="small" @change="currentStepChange">
                <a-step title="报销人员信息" />
                <a-step title="特殊事项" />
                <a-step title="用款计划申请" />
                <a-step title="出差补助及其他" />
                <a-step title="交通费" />
                <a-step title="住宿费" />
                <a-step title="汇总表单" />
            </a-steps>
        </div>
        <div class="internalControl-reimbursement-infoArea-box">
            <div v-if="currentSteps == 0">
                <a-form :form="cform" ref="form" class="internalControl-reimbursement-model-form-box">
                    <a-descriptions bordered style="width: 100%;">
                        <a-descriptions-item>
                            <span slot="label" class="descriptions-label-slot">
                                单据号
                            </span>
                            <a-form-item ref="fdjh" prop="fdjh" class="zm-form-model">
                                <span>{{ formState.fdjh }}</span>
                            </a-form-item>
                        </a-descriptions-item>
                        <a-descriptions-item>
                            <span slot="label" class="descriptions-label-slot">
                                填报日期
                            </span>
                            <a-form-item ref="ftbrq" prop="ftbrq" class="zm-form-model">
                                <span>{{ formState.ftbrq }}</span>
                            </a-form-item>
                        </a-descriptions-item>
                        <a-descriptions-item>
                            <span slot="label" class="descriptions-label-slot">
                                科&nbsp;&nbsp;&nbsp;&nbsp;室
                            </span>
                            <a-form-item ref="fjbks" prop="fjbks" class="zm-form-model">
                                <span>{{ formState.fjbks }}</span>
                            </a-form-item>
                        </a-descriptions-item>
                        <a-descriptions-item>
                            <span slot="label" class="descriptions-label-slot">
                                填报人
                            </span>
                            <a-form-item ref="fjbr" prop="fjbr" class="zm-form-model">
                                <span>{{ formState.fjbr }}</span>
                            </a-form-item>
                        </a-descriptions-item>
                        <a-descriptions-item>
                            <span slot="label" class="descriptions-label-slot">
                                联系电话
                            </span>
                            <a-form-item ref="flxdh" prop="flxdh" class="zm-form-model">
                                <span>{{ formState.flxdh }}</span>
                            </a-form-item>
                        </a-descriptions-item>
                        <a-descriptions-item>
                            <span slot="label" class="descriptions-label-slot">
                                <span class="xhText" >*</span>
                                申请依据
                            </span>
                            <a-form-item ref="fsqyj" prop="fsqyj" class="zm-form-model">
                                <div style="width: 100%;display: flex;">
                                    <!-- <a-input style="width: 90%" v-model="formState.fsqyj"></a-input> -->
                                    <span style="display: inline-block;width: 100% !important;">{{ formState.fsqyj }}</span>
                                    <span style="min-width: 55px !important">
                                        <a-icon @click="fsqyjChange" type="plus-circle" style="color: green;font-size: 18px;margin-left: 5px;"/>
                                        <a-icon @click="deleteSqyjHandle" type="delete" style="color: red;font-size: 18px;margin-left: 10px;"/>
                                    </span>
                                </div>
                            </a-form-item>
                        </a-descriptions-item>
                        <a-descriptions-item :span="3">
                            <span slot="label" class="descriptions-label-slot">
                                内&nbsp;&nbsp;容
                            </span>
                            <a-form-item ref="fbxnrms" prop="fbxnrms" class="zm-form-model">
                                <span>{{ formState.fbxnrms }}</span>
                            </a-form-item>
                        </a-descriptions-item>
                    </a-descriptions>
                </a-form>
                <commpVxeTable
                    :key="dataTableKey"
                    :config="dataTableConfig"
                    :columns="columnsVxe"
                    :formItem="[]"
                    ref="acceptanceRegistrationRef"
                    @checkboxChange="selectedRowKeysChange"
                    @searchEvent="searchEvent"
                    @resetEvent="resetEvent"
                >
                    <!-- <template v-slot:externalOperations="{data}">
                        <vxe-form-item>
                            <template>
                                <a-button v-if="!isView" class="blue-btn" type="primary" @click="addPersonnelClick()" icon="user-add">新增人员</a-button>
                            </template>
                        </vxe-form-item>
                        <vxe-form-item>
                            <template>
                                <a-button v-if="!isView" class="blue-btn" type="primary" @click="selectPersonnelClick()" icon="select">选择人员</a-button>
                            </template>
                        </vxe-form-item>
                    </template> -->
                    <template v-slot:realname_name="{row}">
                        <!-- <a @click="viewClick(row,true)"> -->
                            <span style="padding-right: 21;" v-if="row.realname.length == 2">
                                <span v-for="(trem,tI) in row.realname.split('')" :key="tI" >
                                {{trem}}
                                <span v-if="tI+1 !== row.realname.split('').length">&nbsp;&nbsp;</span>
                                </span>
                            </span>
                            <span style="padding-right: 21;" v-else>{{ row.realname }}</span>
                        <!-- </a> -->
                    </template>
                    <template v-slot:sex_default="{row}">
                        <span>{{ row.sex == 1?'男':'女' }}</span>
                    </template>
                    <template v-slot:operation_btn="{row}" data-desc="自定操作栏">
                        <a-form layout="inline" class="search-form" >
                            <a-form-item >
                                <a-button v-if="!isView" class="blue-btn" type="primary" @click="editClick(row)" icon="edit">修改</a-button>
                            </a-form-item>
                            <a-form-item >
                                <a-button v-if="!isView" class="red-btn" type="primary" @click="deleteClick(row)" icon="delete">删除</a-button>
                            </a-form-item>
                        </a-form>
                    </template>
                </commpVxeTable>
            </div>
            <div v-if="currentSteps == 1">
                <commpVxeTable
                    :key="specialDataTableKey"
                    :config="specialDataTableConfig"
                    :columns="specialColumnsVxe"
                    :formItem="[]"
                    :isCanWrap="true"
                    ref="specialRegistrationRef"
                    @checkboxChange="specialSelectedRowKeysChange"
                    @searchEvent="specialSearchEvent"
                    @resetEvent="specialResetEvent"
                >
                    <template v-slot:fewfybxsqrxm_fwxfsqrxm="{row}">
                        <div v-if="row.fewfybxsqrxm">
                            <span>超期产生额外费用报销：</span>
                            <span>{{ row.fewfybxsqrxm }}</span>
                        </div>
                        <div v-if="row.fwxfsqrxm">
                            <span>午休房报销：</span>
                            <span>{{ row.fwxfsqrxm }}</span>
                        </div>
                    </template>
                    <template v-slot:operation_btn="{row}" data-desc="自定操作栏">
                        <a-form layout="inline" class="search-form" >
                            <a-form-item >
                                <a-button v-if="!isView" class="blue-btn" type="primary" @click="specialViews(row)" icon="eye">预览</a-button>
                            </a-form-item>
                        </a-form>
                    </template>
                </commpVxeTable>
            </div>
            <div v-if="currentSteps == 2" :style="{height:fromState.heightType =='model'?'calc(100vh - 195px)':'calc(100vh - 225px)',overflow: 'auto',}">
                <div style="width: 70%;margin: 30px auto;text-align: -webkit-right;">
                    <a-button @click="indexHandleClick" class="blue-btn" style="margin: 20px 0 5px;">点击选择</a-button>
                    <table border="1" cellspacing="0" class="internalControl-reimbursement-transportation-table" style="width: 100%" :key="tableKey">
                        <tr>
                            <th colspan="6" style="background-color: #5ca3e5 !important;color: white !important;">项目预算指标</th>
                        </tr>
                        <tr>
                            <th>预算指标名称</th>
                            <th>科&ensp;&ensp;室</th>
                            <th>科室经济分类</th>
                            <!-- <th>已申请支付金额</th> -->
                            <th>总指标</th>
                            <th>指标结余</th>
                            <th>支出进度</th>
                        </tr>
                        <tr v-if="currentSteps2Table.length > 0" v-for="(item,index) in currentSteps2Table" :key="index">
                            <td>{{ item.fysxmmc }}</td>
                            <td>{{ item.fbm }}</td>
                            <td>{{ item.fbmjjflmc }}</td>
                            <!-- <td>{{ item.fysqje }}</td> -->
                            <td>{{ item.fzzb }}</td>
                            <td>{{ item.fzbjy }}</td>
                            <td>{{ Number(item.fzcjd * 100).toFixed(2) + '%' }}</td>
                        </tr>
                        <tr v-if="currentSteps2Table.length == 0">
                            <td colspan="6">
                                暂无数据
                            </td>
                        </tr>
                    </table>
                </div>
            </div>
            <div v-if="currentSteps == 3" :style="{height:fromState.heightType =='model'?'calc(100vh - 195px)':'calc(100vh - 225px)',overflow: 'auto',}">
                <div class="fjcts-content-box">
                </div>
                <div style="display: flex;justify-content: center;">
                    <table class="internalControl-reimbursement-serviceFee-table" :id="reimbursementServiceFeeId" border="1" borderColor="#d9d9d9" cellspacing="0" style="border-color: #d9d9d9 !important;">
                        <tr style="background: #dee5ed !important;">
                            <th rowspan="2" style="width: 100px;">报销人员</th>
                            <th colspan="3">出差补助费</th>
                            <!-- <th colspan="2">其他</th> -->
                        </tr>
                        <tr style="background: #dee5ed !important;">
                            <th>天&ensp;&ensp;数</th>
                            <th>标&ensp;&ensp;准</th>
                            <th style="width: 150px;"><span style="color:red;">* </span>金&ensp;&ensp;额</th>
                            <!-- <th>摘&ensp;&ensp;要</th>
                            <th style="width: 150px;">金&ensp;&ensp;额</th> -->
                        </tr>
                        <tr v-for="(item,index) in personnelList" :key="item.id" :style="{background:index % 2 !== 0?'#f0f0f1 !important':''}">
                            <td>
                                <span style="display: flex;justify-content: center;" v-if="item.realname.length == 2">
                                    <span style="width: 48px;display: flex;justify-content: space-between;">
                                        <span v-for="(trem,tI) in item.realname.split('')" :key="tI" >
                                            {{trem}}
                                            <span v-if="tI+1 !== item.realname.split('').length">&nbsp;&nbsp;</span>
                                        </span>
                                    </span>
                                </span>
                                <span v-else>{{ item.realname }}</span>
                                <a-button @click="addRecordList(item.id)" class="blue-btn">添加其他报销</a-button>
                            </td>
                            <td class="serviceFee-icon-text-td">
                                <div class="serviceFee-icon-text">
                                    <a-icon v-if="editTsItem !== 'ts'+index+'-1' && !isView" class="serviceFee-icon" type="form" @click="displayDays(item,index,'-1')" />
                                    <a-input-number
                                     :id="'ts'+index+'-1'+'class'"
                                     v-if="editTsItem == 'ts'+index+'-1'"
                                     style="flex: 1;"
                                     placeholder="请输入天数"
                                     v-model="item.fccts"
                                     :min="0" :precision="0"
                                     @blur="serviceFeeBlur(item)"
                                     />
                                    <span v-else>{{ item.fccts }}</span>
                                </div>
                            </td>
                            <td class="serviceFee-icon-text-td">
                                <div class="serviceFee-icon-text">
                                    <a-icon v-if="editTsItem !== 'ts'+index+'0' && !isView" class="serviceFee-icon" type="form" @click="displayDays(item,index,'0')" />
                                    <a-input-number
                                     :id="'ts'+index+'0'+'class'"
                                     v-if="editTsItem == 'ts'+index+'0'"
                                     style="flex: 1;"
                                     placeholder="请输入标准"
                                     v-model="item.fccbzbz"
                                     :min="0" :precision="0"
                                     @blur="serviceFeeBlur(item)"
                                     />
                                    <span v-else>{{ item.fccbzbz }}</span>
                                </div>
                            </td>
                            <td>
                                {{ item.fccbzje }}元
                            </td>
                            <!-- <td class="serviceFee-icon-text-td">
                                <div class="serviceFee-icon-text">
                                    <a-icon v-if="editTsItem !== 'ts'+index+'-2' && !isView" class="serviceFee-icon" type="form" @click="displayDays(item,index,'-2')" />
                                    <a-input
                                     :id="'ts'+index+'-2'+'class'"
                                     v-if="editTsItem == 'ts'+index+'-2'"
                                     style="flex: 1;"
                                     placeholder="请输入摘要"
                                     v-model="item.fqtzy"
                                     @blur="serviceFeeBlur(item)"
                                      />
                                    <span v-else>{{ item.fqtzy }}</span>
                                </div>
                            </td>
                            <td class="serviceFee-icon-text-td">
                                <div class="serviceFee-icon-text">
                                    <a-icon v-if="editTsItem !== 'ts'+index+'-3' && !isView" class="serviceFee-icon" type="form" @click="displayDays(item,index,'-3')" />
                                    <a-input
                                     :id="'ts'+index+'-3'+'class'"
                                     v-if="editTsItem == 'ts'+index+'-3'"
                                     style="flex: 1;"
                                     placeholder="请输入金额"
                                     v-model="item.fqtje"
                                     @blur="serviceFeeBlur(item)"
                                      />
                                    <span v-else>{{ item.fqtje }} 元</span>
                                </div>
                            </td> -->
                        </tr>
                    </table>
                </div>
                <div style="display: flex;justify-content: center;margin-top: 15px;">
                    <table class="internalControl-reimbursement-serviceFee-table" border="1" borderColor="#d9d9d9" cellspacing="0" style="border-color: #d9d9d9 !important;">
                        <tr style="background: #dee5ed !important;">
                            <th colspan="5">其他</th>
                        </tr>
                        <tr style="background: #dee5ed !important;">
                            <th style="width: 100px;">报销人员</th>
                            <th style="width: 200px;">摘&ensp;&ensp;要</th>
                            <th style="width: 150px;"><span style="color:red;">* </span>金&ensp;&ensp;额</th>
                            <th style="width: 150px;">是否公务卡报销</th>
                            <th style="width: 50px;"></th>
                        </tr>
                        <tr v-for="(item,index) in bxqtzyjlList" :key="item.id" :style="{background:index % 2 !== 0?'#f0f0f1 !important':''}">
                            <td class="serviceFee-icon-text-td">
                                <span style="display: flex;justify-content: center;" v-if="item.fbxrxm.length == 2">
                                    <span style="width: 48px;display: flex;justify-content: space-between;">
                                        <span v-for="(trem,tI) in item.fbxrxm.split('')" :key="tI" >
                                            {{trem}}
                                            <span v-if="tI+1 !== item.fbxrxm.split('').length">&nbsp;&nbsp;</span>
                                        </span>
                                    </span>
                                </span>
                                <span v-else>{{ item.fbxrxm }}</span>
                            </td>
                            <td class="serviceFee-icon-text-td">
                                <div class="serviceFee-icon-text">
                                    <a-icon v-if="editTsItem !== 'ts'+index+'-2' && !isView" class="serviceFee-icon" type="form" @click="displayDays(item,index,'-2')" />
                                    <a-input
                                     :id="'ts'+index+'-2'+'class'"
                                     v-if="editTsItem == 'ts'+index+'-2'"
                                     style="flex: 1;"
                                     placeholder="请输入摘要"
                                     v-model="item.fqtzy"
                                     @blur="editRecordList(item)"
                                      />
                                    <span v-else>{{ item.fqtzy }}</span>
                                </div>
                            </td>
                            <td class="serviceFee-icon-text-td">
                                <div class="serviceFee-icon-text">
                                    <a-icon v-if="editTsItem !== 'ts'+index+'-3' && !isView" class="serviceFee-icon" type="form" @click="displayDays(item,index,'-3')" />
                                    <a-input
                                     :id="'ts'+index+'-3'+'class'"
                                     v-if="editTsItem == 'ts'+index+'-3'"
                                     style="flex: 1;"
                                     placeholder="请输入金额"
                                     v-model="item.fqtje"
                                     @blur="editRecordList(item)"
                                      />
                                    <span v-else>{{ item.fqtje }} 元</span>
                                </div>
                            </td>
                            <td class="serviceFee-icon-text-td">
                                <a-radio-group v-if="!isView" name="radioGroup" v-model="item.fsfgwkfk" @change="editRecordList(item)">
                                    <a-radio value="是">是</a-radio>
                                    <a-radio value="否">否</a-radio>
                                </a-radio-group>
                                <span v-else>{{ item.fsfgwkfk }}</span>
                            </td>
                            <td>
                                <a-icon type="delete" style="color: red;font-size: 18px;" @click="delRecordList(item.id)"/>
                            </td>
                        </tr>
                        <tr v-if="bxqtzyjlList.length == 0">
                            <td colspan="5">暂无数据</td>
                        </tr>
                    </table>
                </div>

            </div>
            <div v-if="currentSteps == 4" :style="{height:fromState.heightType =='model'?'calc(100vh - 195px)':'calc(100vh - 225px)',overflow: 'auto',}">
                <div class="internalControl-reimbursement-summary-table-5">
                    <div class="tabs-card-edit-box">
                        <a-tabs type="card" v-model:activeKey="transportationActiveKey" @change="transportationActiveChange">
                            <a-tab-pane key="交通费填写" tab="交通费填写"></a-tab-pane>
                            <a-tab-pane key="飞机票转账单" tab="飞机票转账单"></a-tab-pane>
                        </a-tabs>
                    </div>
                    <div  class="tab-box-v1" :key="allTableKey" :style="{height: fromState.heightType =='model'?'calc(100vh - 240px)':'calc(100vh - 270px)',overflow: 'auto',paddingTop: '15px',}">
                        <div v-if="transportationActiveKey == '交通费填写'" style="display: flex;justify-content: center;">
                            <table class="internalControl-reimbursement-transportation-table" border="1" borderColor="#d9d9d9" cellspacing="0" style="width: calc(100% - 30px);border-color: #d9d9d9 !important;">
                                <tr style="background: #dee5ed !important;">
                                    <th>费用项目</th>
                                    <th>报销人员</th>
                                    <th>
                                        <span style="color:red;">* </span>
                                        出行方式
                                            <!-- mode="multiple" 可搜欧索  @popupScroll="popupScroll"-->
                                        <br/>
                                        <a-select v-if="!isView" style="width: 135px" @change="cxfsBlur($event,'')" placeholder="批量选择出行方式">
                                            <a-select-opt-group>
                                                <span slot="label">单位派车</span>
                                                <a-select-option value="单位派车">
                                                    单位派车
                                                </a-select-option>
                                            </a-select-opt-group>
                                            <a-select-opt-group label="公共交通">
                                                <a-select-option value="动车">
                                                    动车
                                                </a-select-option>
                                                <a-select-option value="飞机">
                                                    飞机
                                                </a-select-option>
                                                <a-select-option value="大巴">
                                                    大巴
                                                </a-select-option>
                                                <a-select-option value="其他交通方式">
                                                    其他交通方式
                                                </a-select-option>
                                            </a-select-opt-group>
                                        </a-select>
                                    </th>
                                    <th>是否公务卡报销</th>
                                    <th><span style="color:red;">* </span>往返情况</th>
                                    <th><span style="color:red;">* </span>往返日期</th>
                                    <th>是否他人帮垫付</th>
                                    <th>垫付人</th>
                                    <th><span style="color:red;">* </span>应付金额</th>
                                    <th style="width: 50px;"></th>
                                </tr>
                                <tr v-for="(item,index) in transportationList1" :key="index" :style="{background:item.bgColor?'#f0f0f1 !important':''}">
                                    <td :rowspan="item.list.length" v-if="item.list.length !== 0">
                                        城市间交通费
                                    </td>
                                    <td :rowspan="item.list.length" v-if="item.list.length !== 0">
                                        <span style="display: flex;justify-content: center;" v-if="item.realname.length == 2">
                                            <span style="width: 48px;display: flex;justify-content: space-between;">
                                                <span v-for="(trem,tI) in item.realname.split('')" :key="tI" >
                                                    {{trem}}
                                                    <span v-if="tI+1 !== item.realname.split('').length">&nbsp;&nbsp;</span>
                                                </span>
                                            </span>
                                        </span>
                                        <span v-else style="display: block;">{{ item.realname }}</span>
                                        <a-button class="green-btn" @click="nkBxJtxcdAdd(item)" icon="plus">添加路程</a-button>
                                    </td>
                                    <td>
                                        <!-- {{ item.fcsjjtfs }} -->
                                        <a-select
                                            v-if="!isView"
                                            :key="cxfsKey"
                                            size="small"
                                            placeholder="请选择出行方式"
                                            style="width: 131px"
                                            v-model="item.fcsjjtfs"
                                            @change="nkBxJtxcdEdit(item.fcsjjtfs=='飞机'?{fsfgwkbx:'否',fsfgwkdfclff:'否',fcsjjtfs:item.fcsjjtfs,id:item.id}:{fcsjjtfs:item.fcsjjtfs,id:item.id})"
                                            >
                                            <!-- @change="cxfsBlur(1,item.fcsjjtfs=='飞机'?{...item,list:[],fsfgwkbx:'否',fsfgwkdfclff:'否',fcsjjtfs:item.fcsjjtfs}:{...item,list:[],fcsjjtfs:item.fcsjjtfs})" -->
                                            <a-select-opt-group>
                                                <span slot="label">单位派车</span>
                                                <a-select-option value="单位派车">
                                                    单位派车
                                                </a-select-option>
                                            </a-select-opt-group>
                                            <a-select-opt-group label="公共交通">
                                                <a-select-option value="动车">
                                                    动车
                                                </a-select-option>
                                                <a-select-option value="飞机">
                                                    飞机
                                                </a-select-option>
                                                <a-select-option value="大巴">
                                                    大巴
                                                </a-select-option>
                                                <a-select-option value="其他交通方式">
                                                    其他交通方式
                                                </a-select-option>
                                            </a-select-opt-group>
                                        </a-select>
                                        <span v-else>{{ item.fcsjjtfs }}</span><br/>
                                        <a-button v-if="item.fcsjjtfs == '飞机'" class="green-l-btn" @click="addTransfer(item)" style="margin-top: 5px;" icon="highlight">填写申请转账单</a-button>
                                    </td>
                                    <td>
                                        <a-radio-group v-if="!isView" name="radioGroup" :disabled="item.fcsjjtfs == '飞机' && item.fwjtfsfdf == '是'" v-model="item.fsfgwkbx" @change="nkBxJtxcdEdit({fsfgwkbx:item.fsfgwkbx,id:item.id})">
                                            <a-radio value="是">是</a-radio>
                                            <a-radio value="否">否</a-radio>
                                        </a-radio-group>
                                        <span v-else>{{ item.fsfgwkbx }}</span>
                                    </td>
                                    <td>
                                        <!-- {{ item.fwjtfqscs }}-{{ item.fwjtfddcs }} -->
                                        <div>
                                            <a-input v-if="!isView" :disabled="item.fcsjjtfs == '单位派车'" style="width: 130px;" v-model="item.fwjtfqscs" placeholder="起始城市" @blur="nkBxJtxcdEdit({fwjtfqscs:item.fwjtfqscs,id:item.id})" />
                                            <span v-else>{{ item.fwjtfqscs }}</span>
                                            -
                                            <a-input v-if="!isView" :disabled="item.fcsjjtfs == '单位派车'" style="width: 130px;" v-model="item.fwjtfddcs" placeholder="到达城市" @blur="nkBxJtxcdEdit({fwjtfddcs:item.fwjtfddcs,id:item.id})" />
                                            <span v-else>{{ item.fwjtfddcs }}</span>
                                        </div>
                                    </td>
                                            <!-- :default-value="item.fcsjjtwqsrq?[moment(item.fcsjjtwqsrq),moment(item.fcsjjtwddrq)]:[]" -->
                                    <td>
                                        <a-range-picker
                                            v-if="!isView"
                                            :default-value="item.fcsjjtwqsrq?[moment(item.fcsjjtwqsrq),moment(item.fcsjjtwddrq)]:[]"
                                            :disabled="item.fcsjjtfs == '单位派车'"
                                            @change="time1Change($event,'去',item.id)" />
                                        <span v-else>{{ item.fwjtfsfdf }}</span>
                                    </td>
                                    <td>
                                        <!-- {{ item.fwjtfsfdf }} -->
                                        <a-radio-group v-if="!isView" :disabled="item.fcsjjtfs == '单位派车'" name="radioGroup" v-model="item.fwjtfsfdf" @change="nkBxJtxcdEdit({fwjtfsfdf:item.fwjtfsfdf,id:item.id})">
                                            <a-radio value="是">是</a-radio>
                                            <a-radio value="否">否</a-radio>
                                        </a-radio-group>
                                        <span v-else>{{ item.fwjtfsfdf }}</span>
                                    </td>
                                    <td>
                                        <!-- {{ item.fwjtfdfrxm }} fwjtfdfrid -->
                                        <a-select v-if="!isView && item.fcsjjtfs !== '飞机'" :disabled="item.fwjtfsfdf == '否'" v-model="item.fwjtfdfrid" style="width: 120px" @change="nkBxJtxcdEdit({fwjtfdfrid:item.fwjtfdfrid,id:item.id})" placeholder="请选择垫付人">
                                            <a-select-option v-for="(trem,tIndex) in advancePaymentList[index]" :key="tIndex" :value="trem.id">{{ trem.realname }}</a-select-option>
                                        </a-select>
                                        <span v-else>{{ item.fwjtfdfrxm }}</span>
                                    </td>
                                    <td>
                                        <!-- {{ item.fwjtfybje }} -->
                                        <a-input-number
                                            v-if="!isView"
                                            :disabled="item.fcsjjtfs == '单位派车'"
                                            placeholder="请输入应付金额"
                                            v-model="item.fwjtfybje"
                                            :min="0" :precision="2"
                                            @blur="nkBxJtxcdEdit({fwjtfybje:item.fwjtfybje,id:item.id})"
                                            />
                                        <span v-else>{{ item.fwjtfsbje }}</span>
                                    </td>
                                    <td>
                                        <a-icon v-if="item.list.length !== 1" type="delete" style="color: red;font-size: 18px;" @click="nkBxJtxcdDelete(item)"/>
                                    </td>

                                    <!-- <td v-if="((index+1) % 2 == 0) && item.fsfqc !== '是'">
                                        <a-select
                                            v-if="!isView"
                                            :key="cxfsKey"
                                            size="small"
                                            placeholder="请选择出行方式"
                                            style="width: 131px"
                                            v-model="item.fcsjjtfsf"
                                            @change="cxfsBlur(1,item.fcsjjtfsf=='飞机'?{...item,fsfgwkbx:'否',fsfgwkdfclff:'否',fcsjjtfsf:item.fcsjjtfsf}:{...item,fcsjjtfsf:item.fcsjjtfsf})"
                                            >
                                            <a-select-opt-group>
                                                <span slot="label">单位派车</span>
                                                <a-select-option value="单位派车">
                                                    单位派车
                                                </a-select-option>
                                            </a-select-opt-group>
                                            <a-select-opt-group label="公共交通">
                                                <a-select-option value="动车">
                                                    动车
                                                </a-select-option>
                                                <a-select-option value="飞机">
                                                    飞机
                                                </a-select-option>
                                                <a-select-option value="大巴">
                                                    大巴
                                                </a-select-option>
                                                <a-select-option value="其他交通方式">
                                                    其他交通方式
                                                </a-select-option>
                                            </a-select-opt-group>
                                        </a-select>
                                        <span v-else>{{ item.fcsjjtfsf }}</span><br/>
                                        <a-button v-if="item.fcsjjtfsf == '飞机'" class="blue-btn" @click="addTransfer(item)" style="margin-top: 5px;">填写申请转账单</a-button>
                                    </td>
                                    <td v-if="((index+1) % 2 == 0) && item.fsfqc !== '是'">
                                        <a-radio-group v-if="!isView" :disabled="item.fcsjjtfsf == '飞机' && item.ffjtfsfdf == '是'" name="radioGroup" v-model="item.fsfgwkdfclff" @change="transportationBlur({fsfgwkdfclff:item.fsfgwkdfclff,id:item.id})">
                                            <a-radio value="是">是</a-radio>
                                            <a-radio value="否">否</a-radio>
                                        </a-radio-group>
                                        <span v-else>{{ item.fsfgwkdfclff }}</span>
                                    </td>
                                    <td v-if="(index+1) % 2 == 0">
                                        <div>
                                            <a-input v-if="!isView" :disabled="item.fcsjjtfsf == '单位派车'" style="width: 130px;" v-model="item.ffjtfqscs" placeholder="请输入起始城市" @blur="transportationBlur({ffjtfqscs:item.ffjtfqscs,id:item.id})" />
                                            <span v-else>{{ item.ffjtfqscs }}</span>
                                            -
                                            <a-input v-if="!isView" :disabled="item.fcsjjtfsf == '单位派车'" style="width: 130px;" v-model="item.ffjtfddcs" placeholder="请输入到达城市" @blur="transportationBlur({ffjtfddcs:item.ffjtfddcs,id:item.id})" />
                                            <span v-else>{{ item.ffjtfddcs }}</span>
                                        </div>
                                    </td>
                                    <td v-if="(index+1) % 2 == 0">
                                        <a-range-picker
                                            v-if="!isView"
                                            :disabled="item.fcsjjtfsf == '单位派车'"
                                            :default-value="item.fcsjjtfqsrq?[moment(item.fcsjjtfqsrq),moment(item.fcsjjtfddrq)]:[]"
                                            @change="time1Change($event,'返',item.id)" />
                                        <span v-else>{{ item.fwjtfsfdf }}</span>
                                    </td>
                                    <td v-if="((index+1) % 2 == 0) && item.fsfqc !== '是'">
                                        <a-radio-group v-if="!isView" :disabled="item.fcsjjtfsf == '单位派车'" name="radioGroup" v-model="item.ffjtfsfdf" @change="transportationBlur({ffjtfsfdf:item.ffjtfsfdf,id:item.id})">
                                            <a-radio value="是">是</a-radio>
                                            <a-radio value="否">否</a-radio>
                                        </a-radio-group>
                                        <span v-else>{{ item.ffjtfsfdf }}</span>
                                    </td>
                                    <td v-if="((index+1) % 2 == 0) && item.fsfqc !== '是'">
                                        <a-select v-if="!isView && item.fcsjjtfsf !== '飞机'" :disabled="item.ffjtfsfdf == '否'" v-model="item.ffjtfdfrid" style="width: 120px" @change="transportationBlur({ffjtfdfrid:item.ffjtfdfrid,id:item.id})" placeholder="请选择垫付人">
                                            <a-select-option v-for="(trem,tIndex) in advancePaymentList[index]" :key="tIndex" :value="trem.id">{{ trem.realname }}</a-select-option>
                                        </a-select>
                                        <span v-else>{{ item.ffjtfdfrxm }}</span>
                                    </td>
                                    <td v-if="((index+1) % 2 == 0) && item.fsfqc !== '是'">
                                        <a-input-number
                                            v-if="!isView"
                                            :disabled="item.fcsjjtfsf == '单位派车'"
                                            placeholder="请输入应付金额"
                                            v-model="item.ffjtfsbje"
                                            :min="0" :precision="2"
                                            @blur="transportationBlur({ffjtfsbje:item.ffjtfsbje,id:item.id})"
                                            />
                                            <span v-else>{{ item.ffjtfsbje }}</span>
                                    </td> -->
                                </tr>
                            </table>
                        </div>
                        <div v-if="transportationActiveKey == '飞机票转账单'" style="display: flex;justify-content: center;">
                            <commpVxeTable
                                :key="transportationTableKey"
                                :config="transportationTableConfig"
                                :columns="transportationColumnsVxe"
                                :formItem="[]"
                                :isCanWrap="true"
                                ref="specialRegistrationRef"
                            >
                                <template v-slot:operation_fzh="{row}" data-desc="账户">
                                    <span>{{ row.fzh.replace(/(\d{4})(?=\d)/g, "$1 ") }}</span>
                                </template>
                                <template v-slot:operation_btn="{row}" data-desc="自定操作栏">
                                    <a-form layout="inline" class="search-form" >
                                        <a-form-item >
                                            <a-button v-if="!isView" class="blue-btn" type="primary" @click="transportationEditClick(row)" icon="edit">修改</a-button>
                                        </a-form-item>
                                        <a-form-item >
                                            <a-button v-if="!isView" class="red-btn" type="primary" @click="transportationDeleteClick(row)" icon="delete">删除</a-button>
                                        </a-form-item>
                                    </a-form>
                                </template>
                            </commpVxeTable>
                        </div>
                    </div>
                </div>
            </div>
            <div v-if="currentSteps == 5" :style="{height:fromState.heightType =='model'?'calc(100vh - 195px)':'calc(100vh - 225px)',overflow: 'auto',}">
                <div style="display: flex;justify-content: center;">
                    <table class="internalControl-reimbursement-transportation-table" border="1" borderColor="#d9d9d9" cellspacing="0" style="width: calc(100% - 30px);border-color: #d9d9d9 !important;">
                        <tr style="background: #dee5ed !important;">
                            <th>费用项目</th>
                            <th>报销人员</th>
                            <th>天&ensp;&ensp;数</th>
                            <th>住宿费标准</th>
                            <th>是否他人帮垫付</th>
                            <!-- <th>住宿类型</th> -->
                            <th>垫付人</th>
                            <th><span style="color:red;">* </span>应付金额</th>
                            <th>是否公务卡报销</th>
                        </tr>
                        <tr v-for="(item,index) in personnelList" :key="index" :style="{background:index % 2 !== 0?'#f0f0f1 !important':''}">
                            <td>
                                住宿费
                            </td>
                            <td>
                                <span style="display: flex;justify-content: center;" v-if="item.realname.length == 2">
                                    <span style="width: 48px;display: flex;justify-content: space-between;">
                                        <span v-for="(trem,tI) in item.realname.split('')" :key="tI" >
                                            {{trem}}
                                            <span v-if="tI+1 !== item.realname.split('').length">&nbsp;&nbsp;</span>
                                        </span>
                                    </span>
                                </span>
                                <span v-else>{{ item.realname }}</span>
                            </td>
                            <td>
                                <div class="serviceFee-icon-text">
                                    <a-input-number
                                    v-if="!isFbxdzt"
                                    style="flex: 1;"
                                    placeholder="请输入天数"
                                    v-model="item.fzxfts"
                                    :min="0" :precision="0"
                                    @blur="transportationBlur(item)"
                                    />
                                    <span v-else>{{ item.fzxfts }}</span>
                                </div>
                                <!-- {{ item.fzxfts }} -->
                            </td>
                            <td>
                                <a-input-number
                                v-if="!isView"
                                placeholder="请输入住宿费标准"
                                v-model="item.fzsfbz"
                                :min="0" :precision="2"
                                @blur="transportationBlur({fzsfbz:item.fzsfbz,id:item.id})"
                                />
                                <span v-else>{{ item.fzsfbz }}</span>
                            </td>
                            <td>
                                <a-radio-group v-if="!isView" name="radioGroup" v-model="item.fzxfsfdf" @change="transportationBlur({fzxfsfdf:item.fzxfsfdf,id:item.id})">
                                    <a-radio value="是">是</a-radio>
                                    <a-radio value="否">否</a-radio>
                                </a-radio-group>
                                <span v-else>{{ item.fzxfsfdf }}</span>
                            </td>
                            <!-- <td>{{ item.fzxlx }}</td> -->
                            <td>
                                <a-select
                                v-if="!isView"
                                 :disabled="item.fzxfsfdf == '否'"
                                 v-model="item.fzxfdfrid"
                                 style="width: 120px" @change="transportationBlur({fzxfdfrid:item.fzxfdfrid,id:item.id})"
                                 placeholder="请选择垫付人">
                                    <a-select-option v-for="(trem,tIndex) in personnelAdvanceList[index]" :key="tIndex" :value="trem.id">{{ trem.realname }}</a-select-option>
                                </a-select>
                                <span v-else>{{ item.fzxfdfrxm }}</span>
                            </td>
                            <td>
                                <!-- <a-input-number
                                v-if="!isView"
                                placeholder="请输入应付金额"
                                v-model="item.fzxfybje"
                                :min="0" :precision="2"
                                @blur="transportationBlur({fzxfybje:item.fzxfybje,id:item.id})"
                                /> -->
                                <span>{{ item.fzxfsbje }} 元</span>
                            </td>
                            <td>
                                <a-radio-group v-if="!isView" name="radioGroup" v-model="item.fsfgwkfzsf" @change="transportationBlur({fsfgwkfzsf:item.fsfgwkfzsf,id:item.id})">
                                    <a-radio value="是">是</a-radio>
                                    <a-radio value="否">否</a-radio>
                                </a-radio-group>
                                <span v-else>{{ item.fsfgwkfzsf }}</span>
                            </td>
                        </tr>
                    </table>
                </div>

            </div>
            <div v-if="currentSteps == 6" :style="{height:fromState.heightType =='model'?'calc(100vh - 195px)':'calc(100vh - 225px)',overflow: 'auto',}">
                <div class="internalControl-reimbursement-summary-table-5">
                    <div class="tabs-card-edit-box">
                        <a-tabs type="card" v-model:activeKey="summaryActiveKey" @change="summaryActiveChange">
                            <a-tab-pane key="汇总表单" tab="汇总表单"></a-tab-pane>
                            <a-tab-pane key="报销明细" tab="报销明细"></a-tab-pane>
                            <a-tab-pane key="申请转账单" tab="申请转账单"></a-tab-pane>
                            <a-tab-pane key="特殊事项" tab="特殊事项"></a-tab-pane>
                            <a-tab-pane key="事项申请" tab="事项申请"></a-tab-pane>
                        </a-tabs>
                    </div>
                    <div  class="tab-box-v1" :key="allTableKey" :style="{height: fromState.heightType =='model'?'calc(100vh - 240px)':'calc(100vh - 270px)',overflow: 'auto',}">
                        <div v-if="summaryActiveKey == '汇总表单'" class="internalControl-reimbursement-summary-1">
                            <div style="display: flex;">
                                <div class="travelReimbursementForm-print-box">
                                    <h1 class="letterSpan">旅差费报销单</h1>
                                    <div class="travelReimbursementForm-print-title-box" style="padding: 0 40px;">
                                        <span>
                                            <span class="Title">单据号</span> {{ previewTableList.bxd?previewTableList.bxd.fdjh:'' }}
                                        </span>
                                        <span>
                                            <span class="Title">科室</span> {{ previewTableList.bxd?previewTableList.bxd.fjbks:'' }}
                                        </span>
                                        <span>
                                            <span class="Title">填报日期</span>
                                            {{ previewTableList.bxd?previewTableList.bxd.ftbrq.substr(0,4):'' }} <span class="Title">年</span>
                                            {{ previewTableList.bxd?previewTableList.bxd.ftbrq.substr(5,2):'' }} <span class="Title">月</span>
                                            {{ previewTableList.bxd?previewTableList.bxd.ftbrq.substr(8,2):''}} <span class="Title">日</span>
                                        </span>
                                        <span>
                                            <span class="Title">第</span> {{ '1' }} <span class="Title">页共</span> {{ '1' }} <span class="Title">页</span>
                                        </span>
                                    </div>
                                    <table border="1" cellspacing="0" class="travelReimbursementForm-table">
                                        <tr>
                                            <td colspan="2" class="Title">出差<br/>时间</td>
                                            <td colspan="12">
                                                <div style="display: flex;justify-content: space-around;align-items: center;">
                                                <span>
                                                    <span class="Title">自</span>
                                                    {{ previewTableList.bxd?previewTableList.bxd.fbxsjms.substr(0,4):'' }}<span class="Title">年</span>
                                                    {{ previewTableList.bxd?previewTableList.bxd.fbxsjms.substr(5,2):'' }}<span class="Title">月</span>
                                                    {{ previewTableList.bxd?previewTableList.bxd.fbxsjms.substr(8,2):'' }}<span class="Title">日</span>
                                                    <br/>
                                                    <span class="Title">至</span>
                                                    {{ previewTableList.bxd?previewTableList.bxd.fbxsjms.substr(11,4):'' }}<span class="Title">年</span>
                                                    {{ previewTableList.bxd?previewTableList.bxd.fbxsjms.substr(16,2):'' }}<span class="Title">月</span>
                                                    {{ previewTableList.bxd?previewTableList.bxd.fbxsjms.substr(19,2):'' }}<span class="Title">日</span>
                                                </span>
                                                <span>
                                                    <span class="Title">共</span>
                                                    {{ previewTableList.bxd?returnDayNum(previewTableList.bxd.fbxsjms):'' }}
                                                    <span class="Title">天</span>
                                                </span>
                                                </div>
                                            </td>
                                            <td colspan="2" class="Title">姓名</td>
                                            <td colspan="10" style="padding-left: 5px;">{{ previewTableList.bxdgr?getNameList(previewTableList.bxdgr):'' }}</td>
                                            <td colspan="2" class="Title">出差<br/>事由</td>
                                            <td colspan="11" style="text-align: left;padding-left: 5px !important;">{{ previewTableList.bxd?previewTableList.bxd.fjcsxmc:'' }}</td>
                                        </tr>
                                        <colgroup>
                                            <col>
                                            <col>
                                            <col>
                                            <col>
                                            <col>
                                            <col>
                                            <col>
                                            <col>
                                            <col style="width: 1px !important">
                                            <col>
                                            <col>
                                            <col>
                                            <col>
                                            <col style="width: 1px !important">
                                            <col>
                                            <col>
                                            <col>
                                            <col>
                                            <col>
                                            <col>
                                            <col style="width: 1px !important">
                                            <col>
                                            <col>
                                            <col>
                                            <col>
                                            <col>
                                            <col>
                                            <col style="width: 1px !important">
                                            <col>
                                            <col>
                                            <col>
                                            <col>
                                            <col style="width: 1px !important">
                                            <col>
                                            <col>
                                            <col>
                                            <col>
                                            <col>
                                            <col>
                                        </colgroup>
                                        <tr>
                                            <td colspan="8" class="Title letterSpan">起讫时间及地点</td>
                                            <td :rowspan="3+transportationList1.length"></td>
                                            <td colspan="4" class="Title letterSpan">车船票</td>
                                            <td :rowspan="3+transportationList1.length"></td>
                                            <td colspan="6" class="Title letterSpan">出差补助费</td>
                                            <td :rowspan="3+transportationList1.length"></td>
                                            <td colspan="6" class="Title letterSpan">住宿费</td>
                                            <td :rowspan="3+transportationList1.length"></td>
                                            <td colspan="4" class="Title letterSpan">其他</td>
                                            <td :rowspan="3+transportationList1.length"></td>
                                            <td rowspan="2" colspan="2">报销帐号开户行/城市</td>
                                            <td rowspan="2" colspan="2">报销帐号</td>
                                            <td rowspan="2" colspan="2">报销金额(差旅费)</td>
                                        </tr>
                                        <tr>
                                            <td class="Title">月</td>
                                            <td class="Title">日</td>
                                            <td colspan="2" class="Title">起</td>
                                            <td class="Title">月</td>
                                            <td class="Title">日</td>
                                            <td colspan="2" class="Title">讫</td>

                                            <td colspan="2" class="Title">类别</td>
                                            <td colspan="2" class="Title">金额</td>

                                            <td colspan="2" class="Title">天数</td>
                                            <td colspan="2" class="Title">标准</td>
                                            <td colspan="2" class="Title">金额</td>

                                            <td colspan="2" class="Title">天数</td>
                                            <td colspan="2" class="Title">标准</td>
                                            <td colspan="2" class="Title">金额</td>

                                            <td colspan="2" class="Title">摘要</td>
                                            <td colspan="2" class="Title">金额</td>
                                        </tr>
                                        <template v-for="(item,index) in transportationList1" v-if="transportationList1.length">
                                            <tr>
                                                <td :key="index">{{ item.fcsjjtwqsrq?item.fcsjjtwqsrq.substr(5,2):'' }}</td>
                                                <td>{{ item.fcsjjtwqsrq?item.fcsjjtwqsrq.substr(8,2):'' }}</td>
                                                <td colspan="2">{{ item.fwjtfqscs }}</td>
                                                <td>{{ item.fcsjjtwddrq?item.fcsjjtwddrq.substr(5,2):'' }}</td>
                                                <td>{{ item.fcsjjtwddrq?item.fcsjjtwddrq.substr(8,2):'' }}</td>
                                                <td colspan="2">{{ item.fwjtfddcs }}</td>
                                                <td colspan="2">{{ item.fcsjjtfs }}</td>
                                                <td colspan="2">{{ item.fwjtfsbje }}</td>
                                                <td colspan="2" :rowspan="item.list.length" v-if="item.list.length">{{ item.fccts }}</td>
                                                <td colspan="2" :rowspan="item.list.length" v-if="item.list.length">{{ item.fccbzbz }}</td>
                                                <td colspan="2" :rowspan="item.list.length" v-if="item.list.length">{{ item.fccbzje }}</td>
                                                <td colspan="2" :rowspan="item.list.length" v-if="item.list.length">{{ item.fzxfts }}</td>
                                                <td colspan="2" :rowspan="item.list.length" v-if="item.list.length">{{ item.fzsfbz }}</td>
                                                <td colspan="2" :rowspan="item.list.length" v-if="item.list.length">{{ item.fzxfsbje }}</td>
                                                <td colspan="2" :rowspan="item.list.length" v-if="item.list.length">{{ item.fqtzy }}</td>
                                                <td colspan="2" :rowspan="item.list.length" v-if="item.list.length">{{ item.fqtje }}</td>
                                                <td colspan="2" :rowspan="item.list.length" v-if="item.list.length">{{ item.fkfh?item.fkfh:'' + '/' + item.fkhhszd?item.fkhhszd:'' }}</td>
                                                <td colspan="2" :rowspan="item.list.length" v-if="item.list.length">{{ item.fyhkh }}</td>
                                                <td colspan="2" :rowspan="item.list.length" v-if="item.list.length">{{ item.fclfsbhjje }}</td>
                                            </tr>
                                            <!-- <tr>
                                                <td :key="index+'.5'">{{ item.fcsjjtfqsrq?item.fcsjjtfqsrq.substr(5,2):'' }}1</td>
                                                <td>{{ item.fcsjjtfqsrq?item.fcsjjtfqsrq.substr(8,2):'' }}2</td>
                                                <td colspan="2">{{ item.ffjtfqscs }}3</td>
                                                <td>{{ item.fcsjjtfddrq?item.fcsjjtfddrq.substr(5,2):'' }}4</td>
                                                <td>{{ item.fcsjjtfddrq?item.fcsjjtfddrq.substr(8,2):'' }}5</td>
                                                <td colspan="2">{{ item.ffjtfddcs }}6</td>
                                                <td colspan="2">{{ item.fcsjjtfsf }}7</td>
                                                <td colspan="2">{{ item.ffjtfsbje }}8</td>
                                            </tr> -->
                                        </template>
                                        <tr>
                                            <td colspan="8" class="Title">小计</td>
                                            <td colspan="2"></td>
                                            <td colspan="2">{{ previewTableList.bxd?previewTableList.bxd.fjtfxj:'' }}</td>
                                            <td colspan="2"></td>
                                            <td colspan="2"></td>
                                            <td colspan="2">{{ previewTableList.bxd?previewTableList.bxd.fccbzxj:'' }}</td>
                                            <td colspan="2"></td>
                                            <td colspan="2"></td>
                                            <td colspan="2">{{ previewTableList.bxd?previewTableList.bxd.fzsfxj:'' }}</td>
                                            <td colspan="2"></td>
                                            <td colspan="2">{{ previewTableList.bxd?previewTableList.bxd.fqtxj:'' }}</td>
                                            <td colspan="2"></td>
                                            <td colspan="2"></td>
                                            <td colspan="2">{{ previewTableList.bxd?previewTableList.bxd.fclfbxje:'' }}</td>
                                        </tr>
                                        <tr>
                                            <td colspan="5" class="Title">总计金额(大写)</td>
                                            <td colspan="21">
                                                <!-- {{ previewTableList.bxd?amountInWords('贰仟柒佰肆拾壹圆柒角捌分','万'):'' }} <span class="Title">万</span>
                                                {{ previewTableList.bxd?amountInWords('贰万贰仟柒佰肆拾壹圆柒角捌分','仟'):'' }} <span class="Title">仟</span>
                                                {{ previewTableList.bxd?amountInWords('贰万贰仟柒佰肆拾壹圆柒角捌分','佰'):'' }} <span class="Title">佰</span>
                                                {{ previewTableList.bxd?amountInWords('贰万贰仟柒佰肆拾壹圆柒角捌分','拾'):'' }} <span class="Title">拾</span>
                                                {{ previewTableList.bxd?amountInWords('贰万贰仟柒佰肆拾壹圆柒角捌分','圆'):'' }} <span class="Title">元</span>
                                                {{ previewTableList.bxd?amountInWords('贰万贰仟柒佰肆拾壹圆整','角'):'' }} <span class="Title">角</span>
                                                {{ previewTableList.bxd?amountInWords('贰万贰仟柒佰肆拾壹圆柒角','分'):'' }} <span class="Title">分</span> -->
                                                {{ previewTableList.bxd?previewTableList.bxd.fhjbxjedx:'' }}
                                            </td>
                                            <td colspan="13" style="text-align: left;padding-left: 10px !important;">
                                                <span class="Title">核销￥</span>{{ previewTableList.bxd?previewTableList.bxd.fhjbxje:'' }}
                                            </td>
                                        </tr>
                                        <tr>
                                            <td colspan="39">
                                                <div class="travelReimbursementForm-print-title-box" style="padding-left: 15px;padding-right: 100px;">
                                                    <span>
                                                        <span class="Title">公务卡￥</span>{{ previewTableList.bxd?previewTableList.bxd.fgwkbxje:'' }}
                                                    </span>
                                                    <span>
                                                        <span class="Title">转账￥</span>{{ previewTableList.bxd?previewTableList.bxd.fzzbxje:'' }}
                                                    </span>
                                                    <span>
                                                        <span class="Title">储蓄卡￥</span>{{ previewTableList.bxd?previewTableList.bxd.fcxkbxje:'' }}
                                                    </span>
                                                </div>
                                            </td>
                                        </tr>
                                    </table>
                                    <div class="travelReimbursementForm-print-title-box" style="padding-left: 15px;padding-right: 60px;padding-top: 10px;">
                                        <span>
                                            <span class="Title">中心领导</span>
                                            <img v-if="getQmImg(previewTableList.bxd.fzxsprid)" :src="getQmImg(previewTableList.bxd.fzxsprid)" alt="签名图片" class="qmImg">
                                            <span v-else >{{ previewTableList.bxd?previewTableList.bxd.fzxspr:'' }}</span>
                                        </span>
                                        <span>
                                            <span class="Title">审核(会计)</span>
                                            <img v-if="getQmImg(previewTableList.bxd.fcwshrid)" :src="getQmImg(previewTableList.bxd.fcwshrid)" alt="签名图片" class="qmImg">
                                            <span v-else >{{ previewTableList.bxd?previewTableList.bxd.fcwshr:'' }}</span>
                                        </span>
                                        <span>
                                            <span class="Title">科室</span>
                                            <img v-if="getQmImg(previewTableList.bxd.fjbbmshrid)" :src="getQmImg(previewTableList.bxd.fjbbmshrid)" alt="签名图片" class="qmImg">
                                            <span v-else >{{ previewTableList.bxd?previewTableList.bxd.fjbbmshr:'' }}</span>
                                        </span>
                                        <span>
                                            <span class="Title">填报人</span>
                                            <img v-if="getQmImg(previewTableList.bxd.fjbrid)" :src="getQmImg(previewTableList.bxd.fjbrid)" alt="签名图片" class="qmImg">
                                            <span v-else >{{ previewTableList.bxd?previewTableList.bxd.fjbr:'' }}</span>
                                        </span>
                                    </div>
                                </div>
                                <div style="color: #5ca3e5;writing-mode: vertical-rl;display: flex;justify-content: space-evenly;padding: 100px 4px 0px;flex-direction: row;align-items: center;">
                                    <span><span v-if="!isFbxdzt" style="color: red;">* </span>附单据</span>
                                    <a-input v-if="!isFbxdzt" v-model="fromState.fbxdj" @blur="saveClick(true)" style="width: 55px;height: 50px;border-color: red;"></a-input>
                                    <span v-else style="font-size: 14px;">
                                        {{ previewTableList.bxd?previewTableList.bxd.fbxdj:'' }}
                                    </span>
                                    <span>张</span>
                                </div>
                            </div>
                        </div>
                        <div v-if="summaryActiveKey == '报销明细'" class="internalControl-reimbursement-summary-1">
                            <div class="preview-box">
                                <div>
                                    <div class="table-hear">
                                        <h3>报销明细</h3>
                                    </div>
                                    <table class="internalControl-reimbursement-transportation-table" border="1" borderColor="#d9d9d9" cellspacing="0" style="width: calc(100%);border-color: #d9d9d9 !important;">
                                        <tr style="background: #dee5ed !important;">
                                            <th style="width: 70px;">姓&ensp;&ensp;名</th>
                                            <th>科&ensp;&ensp;室</th>
                                            <th>报销内容描述</th>
                                            <th>报销项目分类</th>
                                            <th>报销账户</th>
                                            <th>开户行名称</th>
                                            <th>实报合计费用</th>
                                            <th style="width: 70px;">卡&ensp;&ensp;类</th>
                                        </tr>
                                        <tr v-if="previewTableList.bxmx.length" v-for="(item,index) in previewTableList.bxmx" :key="index" :style="{background:index % 2 !== 0?'#f0f0f1 !important':''}">
                                            <td>{{ item.realname }}</td>
                                            <td>{{ item.fpjks }}</td>
                                            <td>{{ item.fbxnrms }}</td>
                                            <td>{{ item.fbxxmfl1 }}</td>
                                            <td>{{ item.fyhkh }}</td>
                                            <td>{{ item.fkhh }}</td>
                                            <td>{{ item.fbzmx }}</td>
                                            <td>{{ item.fkl }}</td>
                                        </tr>
                                        <tr v-if="previewTableList.bxmx.length == 0">
                                            <td colspan="11">暂无数据</td>
                                        </tr>
                                    </table>
                                </div>
                                <div style="margin-top: 20px;">
                                    <div class="table-hear">
                                        <h3>指标名称</h3>
                                    </div>
                                    <table class="internalControl-reimbursement-transportation-table" border="1" borderColor="#d9d9d9" cellspacing="0" style="width: calc(100%);border-color: #d9d9d9 !important;">
                                        <tr style="background: #dee5ed !important;">
                                            <th>预算指标名称</th>
                                            <th>科&ensp;&ensp;室</th>
                                            <th>科室经济分类</th>
                                            <!-- <th>已申请支付金额</th> -->
                                            <th>总指标</th>
                                            <th>指标结余</th>
                                            <th>支出进度</th>
                                        </tr>
                                        <tr v-if="previewTableList.yszb.length" v-for="(item,index) in previewTableList.yszb" :key="index" :style="{background:index % 2 !== 0?'#f0f0f1 !important':''}">
                                            <td>{{ item.fysxmmc }}</td>
                                            <td>{{ item.fbm }}</td>
                                            <td>{{ item.fbmjjflmc }}</td>
                                            <!-- <td>{{ item.fysqje }}</td> -->
                                            <td>{{ item.fzzb }}</td>
                                            <td>{{ item.fzbjy }}</td>
                                            <td>{{ Number(item.fzcjd * 100).toFixed(2) + '%' }}</td>
                                        </tr>
                                        <tr v-if="previewTableList.yszb.length == 0">
                                            <td colspan="6">暂无数据</td>
                                        </tr>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <div v-if="summaryActiveKey == '事项申请'" class="internalControl-reimbursement-summary-1">
                            <div class="preview-box">
                                <div>
                                    <div class="table-hear">
                                        <h3>事项申请</h3>
                                    </div>
                                    <table class="internalControl-reimbursement-transportation-table" border="1" borderColor="#d9d9d9" cellspacing="0" style="width: calc(100%);border-color: #d9d9d9 !important;">
                                        <tr style="background: #dee5ed !important;">
                                            <th>姓&ensp;&ensp;名</th>
                                            <th>摘&ensp;&ensp;要</th>
                                            <th>操&ensp;&ensp;作</th>
                                        </tr>
                                        <tr v-if="previewTableList.sxsq.length" v-for="(item,index) in previewTableList.sxsq" :key="index" :style="{background:index % 2 !== 0?'#f0f0f1 !important':''}">
                                            <td>{{ item.fxm }}</td>
                                            <td>{{ item.fsy }}</td>
                                            <td>
                                                <a-button class="blue-btn" @click="previewClick(item)">预览</a-button>
                                            </td>
                                        </tr>
                                        <tr v-if="previewTableList.sxsq.length == 0">
                                            <td colspan="3">暂无数据</td>
                                        </tr>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <div v-if="summaryActiveKey == '特殊事项'" class="internalControl-reimbursement-summary-1" style="width: 70%;margin: 0 auto;">
                            <div v-if="previewTableList.tssx.length">
                                <div v-for="(item,index) in previewTableList.tssx" :key="index" style="margin-bottom: 15px;">
                                    <div class="table-hear">
                                        <h3>xx壮族自治区食品药品审评查验中心报账特殊情况申请表</h3>
                                    </div>
                                    <table class="internalControl-reimbursement-transportation-table" border="1" borderColor="#d9d9d9" cellspacing="0" style="width: calc(100%);border-color: #d9d9d9 !important;">
                                        <tr style="background: #dee5ed !important;">
                                            <th colspan="4">审评内容</th>
                                        </tr>
                                        <tr>
                                            <td class="special-table-lable-td">申请科室</td>
                                            <td>{{ fromState.fjbks }}</td>
                                            <td class="special-table-lable-td">申请人</td>
                                            <td>{{ fromState.fjbr }}</td>
                                        </tr>
                                        <tr>
                                            <td class="special-table-lable-td">项目内容</td>
                                            <td>{{ fromState.fbxnrms }}</td>
                                            <td class="special-table-lable-td">项目时间</td>
                                            <td>{{ fromState.fbxsjms }}</td>
                                        </tr>
                                        <tr>
                                            <td class="special-table-lable-td">申请日期</td>
                                            <td>
                                                <span>{{ item.fsqrq?moment(item.fsqrq).format('YYYY-MM-DD'):'' }}</span>
                                            </td>
                                            <td class="special-table-lable-td">特殊情况申请天数</td>
                                            <td>
                                                <span>{{ item.fsqts }}</span>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td class="special-table-lable-td">
                                                <div style="display: flex;justify-content: center;">
                                                    <span style="width: 64px;display: flex;justify-content: space-between;">
                                                        <span>金</span>
                                                        <span>额</span>
                                                    </span>
                                                </div>

                                            </td>
                                            <td>
                                                <span>{{ item.fsqje }}</span>
                                            </td>
                                        </tr>
                                        <tr style="background: #dee5ed !important;" v-if="item.fsqlx == '超期产生' || item.fsqlx == '超期产生和午休房'">
                                            <th colspan="4">超期产生额外费用报销填报</th>
                                        </tr>
                                        <tr v-if="item.fsqlx == '超期产生' || item.fsqlx == '超期产生和午休房'">
                                            <td class="special-table-lable-td">特殊情况说明</td>
                                            <td colspan="3" style="text-align: left;">
                                                <span>{{ item.fewfybxsm }}</span>
                                            </td>
                                        </tr>
                                        <tr v-if="item.fsqlx == '超期产生' || item.fsqlx == '超期产生和超期产生'">
                                            <td class="special-table-lable-td">申请人签字</td>
                                            <td>
                                                <img v-if="getQmImg(item.fsqrid)" :src="getQmImg(item.fsqrid)" alt="签名图片" class="qmImg">
                                                <span v-else>{{ item.fsqr }}</span>
                                            </td>
                                            <td class="special-table-lable-td">中心领导签字确认</td>
                                            <td>
                                                <img v-if="getQmImg(item.fzxldid)" :src="getQmImg(item.fzxldid)" alt="签名图片" class="qmImg">
                                                <span v-else>{{ item.fzxldyjr }}</span>
                                            </td>
                                        </tr>
                                        <tr style="background: #dee5ed !important;" v-if="item.fsqlx == '午休房' || item.fsqlx == '超期产生和午休房'">
                                            <th colspan="4">午休房报销填报</th>
                                        </tr>
                                        <tr v-if="item.fsqlx == '午休房' || item.fsqlx == '超期产生和午休房'">
                                            <td class="special-table-lable-td">项目地址</td>
                                            <td>
                                                <span>{{ item.fwxfbxxmdz }}</span>
                                            </td>
                                            <td class="special-table-lable-td">工作地址</td>
                                            <td>
                                                <span>{{ item.fwxfbxgzdz }}</span>
                                            </td>
                                        </tr>
                                        <tr v-if="item.fsqlx == '午休房' || item.fsqlx == '超期产生和午休房'">
                                            <td class="special-table-lable-td">申请人签字</td>
                                            <td>
                                                <img v-if="getQmImg(item.fsqrid)" :src="getQmImg(item.fsqrid)" alt="签名图片" class="qmImg">
                                                <span v-else>{{ item.fsqr }}</span>
                                            </td>
                                            <td class="special-table-lable-td">中心领导签字确认</td>
                                            <td>
                                                <img v-if="getQmImg(item.fzxldid)" :src="getQmImg(item.fzxldid)" alt="签名图片" class="qmImg">
                                                <span v-else>{{ item.fzxldyjr }}</span>
                                            </td>
                                        </tr>
                                        <tr style="background: #dee5ed !important;" v-if="item.fsqlx == '无单位派车' || item.fsqlx == '超期产生和无单位派车'">
                                            <th colspan="4">无单位派车报销填报</th>
                                        </tr>
                                        <tr v-if="item.fsqlx == '无单位派车' || item.fsqlx == '超期产生和无单位派车'">
                                            <td class="special-table-lable-td">无城市间交通费/无住宿说明</td>
                                            <td colspan="3" style="text-align: left;">
                                                <span>{{ item.fewfybxsm }}</span>
                                            </td>
                                        </tr>
                                        <tr v-if="item.fsqlx == '无单位派车' || item.fsqlx == '超期产生和无单位派车'">
                                            <td class="special-table-lable-td">申请人签字</td>
                                            <td>
                                                <img v-if="getQmImg(item.fsqrid)" :src="getQmImg(item.fsqrid)" alt="签名图片" class="qmImg">
                                                <span v-else>{{ item.fsqr }}</span>
                                            </td>
                                            <td class="special-table-lable-td">中心领导签字确认</td>
                                            <td>
                                                <img v-if="getQmImg(item.fzxldid)" :src="getQmImg(item.fzxldid)" alt="签名图片" class="qmImg">
                                                <span v-else>{{ item.fzxldyjr }}</span>
                                            </td>
                                        </tr>
                                    </table>
                                </div>
                            </div>
                            <div v-else>
                                <a-empty />
                            </div>
                        </div>
                        <div v-if="summaryActiveKey == '申请转账单'" class="internalControl-reimbursement-summary-1">
                            <div v-if="previewTableList.sqzzt.length" class="applicationForTransferForm-print-box preview-box">
                                <div v-for="(item,index) in previewTableList.sqzzt" :key="index">
                                    <h3 style="text-align: center;font-weight: 600;font-size: 22px;">申请转账单</h3>
                                    <table border="1" cellspacing="0" class="applicationForTransferForm-table">
                                        <tr>
                                            <th style="width:130px;">收款单位</th>
                                            <td>{{ item.fskdw }}</td>
                                            <th rowspan="3" style="padding: 0 !important;width:80px;">付款<br/>方式</th>
                                            <td rowspan="3" style="width: 120px;">{{ item.ffkfs }}</td>
                                        </tr>
                                        <tr>
                                            <th style="width:130px;">账&nbsp;&nbsp;号</th>
                                            <td>{{ item.fzh.replace(/(\d{4})(?=\d)/g, "$1 ") }}</td>
                                        </tr>
                                        <tr>
                                            <th style="width:130px;">开户银行</th>
                                            <td>{{ item.fkhyh }}</td>
                                        </tr>
                                        <tr>
                                            <th style="width:130px;">金&nbsp;&nbsp;额</th>
                                            <td>{{ item.fjedx }}</td>
                                            <td colspan="2" style="text-align: left;">{{ '￥'+item.fjexx }}</td>
                                        </tr>
                                        <tr>
                                            <th style="width:130px;">用&nbsp;&nbsp;途</th>
                                            <td colspan="3">{{ item.fyt.toString() }}</td>
                                        </tr>
                                    </table>
                                </div>
                            </div>
                            <div v-else>
                                <a-empty />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div style="display: flex;justify-content: flex-end;margin: 0 15px;margin-top: 5px;" v-if="!isView">
                <a-button v-if="currentSteps == 5" class="green-btn" type="primary" style="margin-right: 10px;" icon="ordered-list" @click="systemPff">相关制度</a-button>
                <a-button v-if="currentSteps !== 6" class="blue-btn" type="primary" style="margin-right: 10px;" icon="folder" @click="saveClick(true)">保存</a-button>
                <a-button v-if="!isFbxdzt" type="primary" style="margin-right: 10px;" ghost icon="arrow-left" @click="saveClick(false,'上一步')">上一步</a-button>
                <a-button v-if="currentSteps !== 6 " type="primary" style="margin-right: 10px;" ghost icon="arrow-right" @click="saveClick(false,'下一步')">下一步</a-button>
                <a-button v-if="currentSteps == 6" class="blue-btn" type="primary" style="margin-right: 10px;" icon="folder" @click="totalPrintClick(true)">打包打印</a-button>
                <a-button v-if="currentSteps == 6 && !isFbxdzt" class="blue-btn" type="primary" style="margin-right: 10px;" icon="check-circle" @click="saveClick(false,'下一步',true)">完成</a-button>
            </div>
        </div>
        <a-modal
            title="差旅住宿费标准调整表"
            :visible="tableVisible"
            @ok="tableVisible = false"
            @cancel="tableVisible = false"
            :dialog-style="{ top: '40px' }"
            :width="1100"
            :footer="false"
        >
            <a-spin size="large" :spinning="spinning" >
                <iframe
                    :key="iframeDataKey"
                    v-if="iframeSrc"
                    :src="iframeSrc"
                    ref="iframeServerEditingRef"
                    scrolling="auto"
                    width="100%"
                    :height="(windowInnerHeight - 250 )+'px'"
                    style="border: 0;"
                ></iframe>
                <span v-else>当前文件发生错误！</span>
            </a-spin>
        </a-modal>
        <addPersonnel ref="addPersonnelRef" @dataTableChange="dataTableChange"/>
        <selectPersonnel ref="selectPersonnelRef" @dataTableChange="dataTableChange"/>
        <additionalReimbursement ref="additionalReimbursementRef" @successSpecialData="successSpecialData" /><!--新增编辑特殊事项-->
        <selectApplicant ref="selectApplicantRef" @getApplicantData="getApplicantData"/>
        <totalPrint ref="totalPrintRef" />
        <selectSqyjTable ref="selectSqyjTableRef" @getData="getData"/>
        <selectProjectBudgetIndicators ref="selectProjectBudgetIndicatorsRef" @getIndexHandle="getIndexHandle"/>
        <addApplicationForTransferForm  ref="addApplicationForTransferFormRef" @transportationBlur="transportationBlur" @updatezzsquSuccess="updatezzsquSuccess" @getupdatejczt="getupdatejczt"/>
        <oaModal v-show="false" ref="oaModalRef" ></oaModal>
    </div>
</template>
<script>
import {
    jcyfybxdqueryBxryxxListBySqsxId,//初始化及查询报销单信息
    jcyfybxddeleteBxrymxById,
    jcyfybxdupdateBxd,//保存
    jcyfybxdreturnFybxd,//上一步
    jcyfybxdsubmitFybxd,//下一步
    jcyfybxddeleteFybxdTssxSq,
    jcyfybxdqueryBxryxxListByBxdId,
    jcyfybxdupdateBxrymxxx,
    jcyfybxdbatchSetBxdCxfs,
    jcyfybxdqueryFybxdDfryList,
    jcyfybxdqueryFybxdTssxSqPageList,
    zzrybxdquerytssxsqByfybxd,
    jcyfybxdupdateFybxdTssxSq,
    jcyfybxdqueryZjlwfList,
    jcyfybxdbatchSzLwHsJtbzTs,
    zzrybxdgetZzryBd,
    initBzFlow,
    zzrybxdupdateCcbz,
    downMyQm,
    zzrybxdupdategrje,
    zzrybxdgethzdByBxd,
    zzrybxddeletesqyj,
    zzrybxdDeletzzsq,
    zzrybxdupdatejczt,
    initSqsxFybxd,
    zzrybxdgetYlsj,
    zzrybxdPreviewfj,
    initSqsxFybxds,
    getSpuser,
    getMoreUserSignLinkList,
    bxqtzyjlList,
    bxqtzyjlAdd,
    bxqtzyjlEdit,
    bxqtzyjlDelete,
    zzlist,
    jcyfybxdNkBxJtxcdAdd,
    jcyfybxdNkBxJtxcdEdit,
    jcyfybxdNkBxJtxcdDelete,
    zzrybxdJzsqd,
} from './service/index'
import additionalReimbursement from './additionalReimbursement'
import assessCheckApi from './service/api'
import commpVxeTable from '@/components/commp-vxe-table/commp-vxe-table.vue'
import addPersonnel from './addPersonnel'
import selectPersonnel from './selectPersonnel'
import compSelector from '@/components/compSelector/compSelector.vue'
import selectApplicant from './selectApplicant'
import moment from 'moment'
import totalPrint from './totalPrint'
import selectSqyjTable from './selectSqyjTable'
import selectProjectBudgetIndicators from './selectProjectBudgetIndicators'
import addApplicationForTransferForm from '../applicationForTransfer/increase'
// import oaModal from '@/views/administrativeOffice-new/yiBan/index' //递归组件需要components内部引入
import YchConstant from '@/api/YchConstant'
export default {
    components:{
        commpVxeTable,
        addPersonnel,
        compSelector,
        selectPersonnel,
        additionalReimbursement,
        selectApplicant,
        totalPrint,
        selectSqyjTable,
        selectProjectBudgetIndicators,
        addApplicationForTransferForm,
        oaModal: () => import('@/views/administrativeOffice-new/yiBan/index')
    },
    props:{

    },
    data(){
        return{
            moment:moment,
            currentSteps:0,
            fbxdztList:['报销人员信息','特殊事项','用款计划申请','出差补助及其他','交通费','住宿费','汇总表单'],
            fromState:{},
            dataTableKey:null,
            dataTableConfig:{
                api: assessCheckApi.jcyfybxdqueryBxryxxListByBxdId,
                rowId: 'id',
                autoHidden:true,
                height:window.innerHeight - 400,
                urlType: true,
                paramet:{
                }
            },
            columnsVxe:[{
                type: 'checkbox',
                width: 60 ,
                fixed: 'left'
            },{
                title: '姓名', //列头显示文字
                field: 'realname',
                slots: {
                    header:'realname_header',
                    default: 'realname_name'
                },
                titleInterval:true,
                width:90,
            },{
                title: '性别', //列头显示文字
                field: 'sex',
                titleInterval:true,
                slots: {
                    header:'sex_header',
                    default:'sex_default',
                },
                width:70,
            },{
                title: '工作单位',
                field: 'fgzdw',

            },{
                title: '银行卡号', //列头显示文字
                field: 'fyhkh',
                width:195,
            },{
                title: '开户行', //列头显示文字
                field: 'fkfh',
                width:115,
            },{
                title: '开户行所在地', //列头显示文字
                field: 'fkhhszd',
            },{
                title: '手机号码', //列头显示文字
                field: 'phone',
                width:115,
            },{
                title: '操作',
                field: 'id',
                slots: {
                    default: 'operation_btn'
                },
                fixed: 'right',
                width:180,
            }],
            isSpecial:'',
            specialDataTableKey:null,
            specialDataTableConfig:{
                api: assessCheckApi.zzrybxdquerytssxsqByfybxd,
                rowId: 'id',
                height:window.innerHeight - 230,
                autoHidden:true,
                urlType: true,
                paramet:{
                    fsqsxid: ''
                }
            },
            specialColumnsVxe:[{
                type: 'checkbox',
                width: 60 ,
                fixed: 'left'
            },{
                title: '项目内容', //列头显示文字
                field: 'fxmnr',
            },{
                title: '项目时间', //列头显示文字
                field: 'fxmsj',
            },{
                title: '申请日期', //列头显示文字
                field: 'fsqrq',
            },{
                title: '申请类型', //列头显示文字
                field: 'fsqlx',
            },
            {
                title: '操作',
                field: 'id',
                slots: { default: 'operation_btn' },
                fixed: 'right',
                width: 100,
            }
            ],
            personnelList:[],
            editTsItem:'',
            transportationList:[],
            transportationList1:[],
            cxfsKey:null,
            cxfsSyArr:'',
            transportationEditItem:'',
            advancePaymentList:[],
            personnelAdvanceList:[],
            summaryActiveKey:'汇总表单',
            transportationActiveKey: '交通费填写',
            allSpecialList:[],
            expertServicesList:[],
            expertServicesTotal:0,//parseFloat(sum.toFixed(2))
            isFbxdzt:false,
            isView:false,
            reimbursementServiceFeeId:'reimbursementServiceFee'+Date.now(),
            reimbursementServiceFeeHeight:911,
            cform:this.$form.createForm(this, { name: 'cform' }),
            formState: {},
            tableKey: '',
            allTableKey: '',
            sqsxId: '',
            currentSteps2Table: [],
            previewTableList: [],
            transportationTableKey: '',
            transportationTableConfig:{
                api: assessCheckApi.zzrybxdselectzzsq,
                rowId: 'id',
                height:window.innerHeight - 280,
                autoHidden:true,
                urlType: true,
                paramet:{
                    fbxdid: ''
                }
            },
            transportationColumnsVxe:[
            {
                title: '往返程', //列头显示文字
                field: 'fwfqk',
                width: 100,
            },{
                title: '收款单位', //列头显示文字
                field: 'fskdw',
            },{
                title: '开户银行', //列头显示文字
                field: 'fkhyh',
            },{
                title: '账户', //列头显示文字
                field: 'fzh',
                slots: { default: 'operation_fzh' },
                width: 250,
            },{
                title: '转账金额', //列头显示文字
                field: 'fjexx',
                width: 100,
            },{
                title: '用途', //列头显示文字
                field: 'fyt',
            },{
                title: '操作',
                field: 'id',
                slots: { default: 'operation_btn' },
                fixed: 'right',
                width:180,
            }],
            tableVisible: false,
            iframeDataKey:null,
            iframeSrc:'',
            windowInnerHeight:window.innerHeight,
            spinning: false,
            qmImgList: [],
            bxqtzyjlList: [],
        }
    },
    watch:{

    },
    mounted(){
        // this.getData({sqsxid:'1675792718531424258',view:true})
    },
    methods:{
        getData(row){
            //console.log('PPPPPPPP',row)
            this.fromState = row

            this.isView = row.view?true:false
            row.isChange?this.sqsxId = row.fpid:''
            this.dataTableConfig.height =  row.heightType =='model'?window.innerHeight - 370:window.innerHeight - 400
            this.specialDataTableConfig.height =  row.heightType =='model'?window.innerHeight - 200:window.innerHeight - 230
            jcyfybxdqueryBxryxxListBySqsxId({sqsxid:row.fpid,lcbm: row.flcmb,bxdlx: '在职（本单位人员）出差报销单'}).then(res=>{
                if(res.code == 200){
                    //console.log('报销单所有信息',res)
                    this.currentSteps = this.fbxdztList.indexOf(res.result.bxd.fbxdzt=='完成'?'汇总表单':res.result.bxd.fbxdzt)
                    if(this.currentSteps == 2){
                        this.getReimbursementServiceFee()
                    }
                    this.isFbxdzt = res.result.bxd.fbxdzt=='完成' || row.view?true:false
                    this.formState = res.result.bxd
                    this.fromState = {
                        ...row,
                        ...res.result.bxd,
                        heightType:row.heightType,
                        id:undefined,
                        fbxdid:res.result.bxd && res.result.bxd.id?res.result.bxd.id:''
                    }
                    this.currentSteps2Table = []
                    if(res.result.ysxmList){
                        this.currentSteps2Table.push(res.result.ysxmList)
                    }
                    this.isSpecial = this.fromState.fsfytssxsq?this.fromState.fsfytssxsq:''
                    if(res.result.bxd && res.result.bxd.id){

                        this.dataTableConfig.paramet = {fbxdid:res.result.bxd.id}
                        this.specialDataTableConfig.paramet = {fsqsxid:res.result.bxd.fsqsxid}
                        this.dataTableKey = Date.now()
                        this.specialDataTableKey = Date.now()
                        //console.log('报销单所有信息',this.dataTableConfig)
                        this.getPersonnelData(res.result.bxd.id,true)
                        // this.getAllSpecial() //特殊事项列表
                        // this.getExpertServices() // 专家劳务费个税
                    }
                    if(this.currentSteps == 6){
                        this.getAllData()
                    }
                    this.getPersonList()
                    this.getBxqtzyjlList()
                }
            })
        },
        getNewData(val){
            //console.log('wwwwwwwwww',val)
            this.isView = val.view?true:false
            val.isChange?this.sqsxId = val.fpid:''
            this.dataTableConfig.height =  val.heightType =='model'?window.innerHeight - 370:window.innerHeight - 400
            this.specialDataTableConfig.height =  val.heightType =='model'?window.innerHeight - 200:window.innerHeight - 230
            initSqsxFybxd({bxlx: '差旅报销',bxdlx: '在职（本单位人员）出差报销单'}).then(res => {
                if(res.success){
                    let data = {
                        ...res.result.records,
                        fbxdid:res.result.records.id
                    }
                    this.formState = {...data}
                    this.fromState = {...data,heightType:val.heightType,}
                    //console.log(this.formState)
                    if(res.result.records.fsqsxid){
                        this.getData({
                            ...res.result.records,
                            heightType:val.heightType,
                            view:val.view,
                            fpid: res.result.records.fsqsxid,
                            flcmb: res.result.records.flcbm})
                    }
                } else {
                    this.visible = false
                    this.$message.warning(res.message)
                }
            })
        },
        getApplication(data){
            initSqsxFybxds(data).then(res => {
                if(res.success){
                    let data = {
                        ...res.result.records,
                        fbxdid:res.result.records.id
                    }
                    this.formState = {...data}
                    this.fromState = {...data,heightType:data.heightType,}
                    //console.log(this.formState)
                    if(res.result.records.fsqsxid){
                        this.getData({
                            ...res.result.records,
                            heightType:data.heightType,
                            view:data.view,
                            fpid: res.result.records.fsqsxid,
                            flcmb: res.result.records.flcbm})
                    }
                } else {
                    this.visible = false
                    this.$message.warning(res.message)
                }
            })
        },
        // 汇总表单
        getAllData(){
            //console.log('汇总表单,我进来了',this.fromState)
            zzrybxdgetZzryBd({bxdid: this.fromState.fbxdid}).then(res => {
                //console.log('结果？？？',res)
                this.previewTableList = []
                this.previewTableList = res.result.records
                this.allTableKey = Date.now()
                this.getZzrybxdJzsqd()
            })
        },
        getZzrybxdJzsqd(){
            zzrybxdJzsqd({bxdid: this.fromState.fbxdid}).then(res => {
                if(res.success && res.result){
                    this.previewTableList.sqzzt = res.result
                }
            })
        },
        currentStepChange(val){
            if(val == 2){
                this.getReimbursementServiceFee()
            }
            //console.log(val)
            // if(!this.isFbxdzt){
            //     this.currentSteps = val
            // }
        },
        getReimbursementServiceFee(){
            this.$nextTick(()=>{
                setTimeout(()=>{
                    this.reimbursementServiceFeeHeight = document.getElementById(this.reimbursementServiceFeeId).offsetWidth
                },200)
            })
        },
        getAllSpecial(){
            jcyfybxdqueryFybxdTssxSqPageList({fbxdid:this.fromState.fbxdid}).then(res=>{
                if(res.code == 200){
                    this.allSpecialList = res.result.records
                }else{
                    this.allSpecialList = []
                }
            })
        },
        async getPersonnelData(id,val){
            await jcyfybxdqueryBxryxxListByBxdId({fbxdid:id}).then(res=>{//根据报销单id查询人员列表
                if(res.code == 200){
                    // this.advancePaymentList = []
                    // this.personnelAdvanceList = []
                    let item1 = res.result.records
                    this.personnelList = item1
                    // res.result.records.forEach(async(item,index)=>{
                    //     if(val){
                    //         await jcyfybxdqueryFybxdDfryList({id:item.id,fbxdid:this.fromState.fbxdid}).then(res1=>{
                    //             if(res1.code == 200){
                    //                 this.advancePaymentList.push(res1.result)
                    //                 this.advancePaymentList.push(res1.result)
                    //                 this.personnelAdvanceList.push(res1.result)
                    //             }else{
                    //                 this.advancePaymentList.push([])
                    //                 this.personnelAdvanceList.push([])
                    //             }
                    //         })
                    //     }
                    // })
                    if(val){
                        this.f1(res.result.records,this.fromState.fbxdid)
                    }
                    //console.log('我获取人数',this.advancePaymentList)
                }else{

                }
            })
            zzlist({fbxdid:id}).then(res=>{//根据报销单id查询人员列表-交通费
                if(res.code == 200){
                    this.transportationList = []
                    this.transportationList1 = []
                    if(val && this.currentSteps == 4){
                        this.f1(res.result.records,this.fromState.fbxdid)
                    }
                    const sortedItems = res.result.records.slice().sort((a, b) => {
                        if (a.realname < b.realname) {
                            return -1;
                        }
                        if (a.realname > b.realname) {
                            return 1;
                        }
                        // 如果名字相同，则不改变它们的相对顺序
                        return 0;
                    })
                    //console.log('重新排列后：',sortedItems)
                    sortedItems.forEach((item,index)=>{
                        this.transportationList.push({...item,bgColor:(index+1) % 2 == 0?true:false,list:[]})
                        this.transportationList1.push({...item,bgColor:(index+1) % 2 == 0?true:false,list:[]})

                    })
                    let num = ''
                    let arr1 = []
                    let arr2 = {}
                    this.transportationList.forEach((item,index) => {
                        //console.log(index,':',item.realname)
                        if(arr1.indexOf(item.realname) == -1){
                            arr2 = {}
                            arr1.push(item.realname)
                            num = index

                            arr2 = this.personnelList.filter(items => items.realname == item.realname)
                            //console.log('匹配成功的===========',arr2)
                            let data = {
                                // flwfts: arr2[0].flwfts,
                                // flwfsbje: arr2[0].flwfsbje,
                                // fhsbzts: arr2[0].fhsbzts,
                                // fhsbzsbje: arr2[0].fhsbzsbje,
                                // fsnjtbzts: arr2[0].fsnjtbzts,
                                // fsnjtbzje: arr2[0].fsnjtbzje,

                                fccts: arr2[0].fccts,
                                fccbzbz: arr2[0].fccbzbz,
                                fccbzje: arr2[0].fccbzje,
                                fzsfbz: arr2[0].fzsfbz,
                                fzxfts: arr2[0].fzxfts,
                                fzxfsbje: arr2[0].fzxfsbje,
                                fclfsbhjje: arr2[0].fclfsbhjje,
                                fzxfsfdf: arr2[0].fzxfsfdf,
                                fzxfdfrxm: arr2[0].fzxfdfrxm,
                                fqtzy: arr2[0].fqtzy,
                                fqtje: arr2[0].fqtje,
                                fyhkh: arr2[0].fyhkh,
                                fkfh: arr2[0].fkfh,
                                fkhhszd: arr2[0].fkhhszd,
                            }
                            this.transportationList1[num] = {...item,...data}
                            this.transportationList1[num].list.push(item)
                            //console.log('交通费人员列表---',this.transportationList1)
                        } else {
                            //console.log('放进去的',item)
                            let arr3 = this.personnelList.filter(items => items.realname == item.realname)
                            //console.log('匹配成功的----------',arr3[0].fclfsbhjje)
                            this.transportationList1[index] = {
                                ...item,
                                fclfsbhjje: arr3[0].fclfsbhjje,
                                fzxfsfdf: arr3[0].fzxfsfdf,
                                fzxfdfrxm: arr3[0].fzxfdfrxm,
                            }
                            this.transportationList1[num].list.push(item)
                        }
                    })
                    this.tableKey = Date.now()
                    //console.log('交通费人员列表---',this.transportationList1)
                }else{}
            })
        },
        async f1(item,ids){
            this.advancePaymentList = []
            this.personnelAdvanceList = []
            var dd=[]
            var advance = []
            ! await function f2(){
                    return new Promise(resolve=>{
                        var x=0;
                        dfs(x)
                        function dfs(x){ //递归
                            jcyfybxdqueryFybxdDfryList({id:item[x].id,fbxdid:ids}).then((res)=>{
                                // let res1=JSON.stringify(res.result)//对象转为json
                                let res1= res.result
                                dd.push(res1)
                                advance.push(res1)
                                advance.push(res1)
                                //console.log("ddli:"+x)
                                x++;
                                if(x<item.length){
                                    dfs(x)
                                }else{
                                    resolve()//递归完成，返回Promise.resolve
                                }
                            })
                        }
                    })
            }()
            await console.log("ddwai:"+dd)
            this.personnelAdvanceList = dd
            this.advancePaymentList = advance
            //console.log('我获取垫付人列表',this.personnelAdvanceList)
            //console.log('我获取人数',this.advancePaymentList)
        },
        nkBxJtxcdAdd(item){
            let data = {
                fbxdid: this.fromState.fbxdid,
                fuserid: item.fuserid,
                fbxdgrid: item.fbxdgrid,
            }
            jcyfybxdNkBxJtxcdAdd(data).then(res => {
                if(res.success){
                    this.$message.success(res.message)
                    this.getPersonnelData(this.fromState.fbxdid,true)
                } else {
                    this.$message.warning(res.message)
                }
            })
        },
        nkBxJtxcdEdit(item,val){
            jcyfybxdNkBxJtxcdEdit({fbxdid:this.fromState.fbxdid,...item}).then(res=>{
                if(res.code == 200){
                    this.$message.success(res.message)
                    this.getPersonnelData(this.fromState.fbxdid)
                    if(val == '出行方式'){
                        this.getData(this.fromState)
                    }
                }else{
                    this.$message.warning(res.message)
                }
            })
        },
        nkBxJtxcdDelete(item){
            var that = this
            that.$confirm({
                title: '您确认要删除当前交通记录吗?',
                onOk() {
                    let data = {
                        fbxdid: that.fromState.fbxdid,
                        fuserid: item.fuserid,
                        fbxdgrid: item.fbxdgrid,
                        id: item.id,
                    }
                    jcyfybxdNkBxJtxcdDelete(data).then(res=>{
                        if(res.code == 200){
                            that.$message.success(res.message)
                            that.getPersonnelData(that.fromState.fbxdid,true)
                        }else{
                            that.$message.warning(res.message)
                        }
                    })
                },
                onCancel() {
                    //console.log('Cancel');
                },
            });
        },
        getExpertServices(){
            jcyfybxdqueryZjlwfList({fbxdid:this.fromState.fbxdid}).then(res=>{
                if(res.code == 200){
                    this.expertServicesList = res.result.records
                    var sum = 0
                    res.result.records.forEach((item,index)=>{
                        let num = Number(item.flwfsqje)
                        sum += num
                    })
                    this.expertServicesTotal = parseFloat(sum.toFixed(2))
                }else{
                    this.expertServicesList = []
                }
            })
        },
        //0
        selectedRowKeysChange(){

        },
        searchEvent(){

        },
        resetEvent(){

        },
        dataTableChange(){
            this.dataTableKey = Date.now()
        },
        addPersonnelClick(){
            this.$refs.addPersonnelRef.getData({sqsxid:this.fromState.sqsxid,fbxdid:this.fromState.fbxdid,})
            this.$refs.addPersonnelRef.visible = true
        },
        selectPersonnelClick(){
            this.$refs.selectPersonnelRef.getData({sqsxid:this.fromState.sqsxid,fbxdid:this.fromState.fbxdid,})
            this.$refs.selectPersonnelRef.visible = true
        },
        editClick(row){
            //console.log(row)
            this.$refs.addPersonnelRef.getData({sqsxid:this.fromState.sqsxid,fbxdid:this.fromState.fbxdid,...row})
            this.$refs.addPersonnelRef.visible = true
        },
        deleteClick(row){
            //console.log(row)
            let that = this
            this.$confirm({
                title:'您确认删除吗？',
                // icon: createVNode(ExclamationCircleOutlined),
                onOk() {
                    jcyfybxddeleteBxrymxById({id:row.id}).then(res=>{
                        if(res.code == 200){
                            that.$message.success(res.message)
                            that.dataTableChange()
                        }else{
                            that.$message.warning(res.message)
                        }
                    })
                }
            })

        },
        // 选择申请依据
        fsqyjChange(){
            this.$refs.selectSqyjTableRef.visible = true
            this.$refs.selectSqyjTableRef.getData({bxdid:this.fromState.fbxdid},'差旅报销')
        },
        // 删除申请依据
        deleteSqyjHandle(){
            let that = this
            this.$confirm({
                title:'您确认要清空申请依据吗？',
                onOk() {
                    zzrybxddeletesqyj({bxdid: that.fromState.fbxdid}).then(res=>{
                        if(res.code == 200){
                            that.$message.success(res.message)
                            //console.log(that.fromState)
                            that.getData({
                                heightType:that.fromState.heightType,
                                view:that.fromState.view,
                                fpid: '',
                                flcmb: that.fromState.flcmb})
                        }else{
                            that.$message.warning(res.message)
                        }
                    })
                }
            })
        },
        //1
        specialSelectedRowKeysChange(){

        },
        specialSearchEvent(){

        },
        specialResetEvent(){

        },
        specialAddClick(){
            this.$refs.additionalReimbursementRef.getData({
                sqsxid:this.fromState.sqsxid,
                fbxdid:this.fromState.fbxdid,
                fjbks:this.fromState.fjbks,
                fjbr:this.fromState.fjbr,
                fbxnrms:this.fromState.fbxnrms,
                fbxsjms:this.fromState.fbxsjms,
            },{})
            this.$refs.additionalReimbursementRef.visible = true
        },
        specialPrintClick(){

        },
        specialEditClick(row){
            //console.log(row)
            this.$refs.additionalReimbursementRef.getData({
                sqsxid:this.fromState.sqsxid,
                fbxdid:this.fromState.fbxdid,
                fsqlx:row.fsqlx,
                fjbks:this.fromState.fjbks,
                fjbr:this.fromState.fjbr,
                fbxnrms:this.fromState.fbxnrms,
                fbxsjms:this.fromState.fbxsjms,
                isEide:true,
            },row)
            this.$refs.additionalReimbursementRef.visible = true
        },
        specialDeleteClick(row){
            let that = this
            this.$confirm({
                title:'您确认删除吗？',
                // icon: createVNode(ExclamationCircleOutlined),
                onOk() {
                    jcyfybxddeleteFybxdTssxSq({id:row.id}).then(res=>{
                        if(res.code == 200){
                            that.$message.success(res.message)
                            that.successSpecialData()
                        }else{
                            that.$message.warning(res.message)
                        }
                    })
                }
            })
        },
        specialViews(row){
            //console.log(row)
            this.$refs.additionalReimbursementRef.getEsitData({
                fsxsqid: this.formState.fpid,
                lcbm: this.formState.flcmb,
                ...row,
            },true)
            this.$refs.additionalReimbursementRef.visible = true
        },
        successSpecialData(){
            this.getData(this.fromState)
            this.specialDataTableKey = Date.now()
        },
        //添加特殊报销项
        addSpecialReimburse(val){
            //console.log(val)
            this.$refs.additionalReimbursementRef.getData({
                fsqlx:val,
                sqsxid:this.fromState.sqsxid,
                fbxdid:this.fromState.fbxdid,
                fjbks:this.fromState.fjbks,
                fjbr:this.fromState.fjbr,
                fbxnrms:this.fromState.fbxnrms,
                fbxsjms:this.fromState.fbxsjms,
            },{})
            this.$refs.additionalReimbursementRef.visible = true
        },
        // 选择项目预算指标
        indexHandleClick(){
            this.$refs.selectProjectBudgetIndicatorsRef.visible = true
        },
        // 获取项目预算指标
        getIndexHandle(item,value){
            this.currentSteps2Table = []
            this.currentSteps2Table = item
            this.fromState.fysxmid = value.join(','),
            this.tableKey = Date.now()
            this.saveClick(true)
        },
        //出差补助及其他
        displayDays(item,index,val){
            this.editTsItem = 'ts'+index+val
            let refData = 'ts'+index+val+'ref'
            let that = this
            setTimeout(() => {
                this.$nextTick(() => {
                    document.getElementById('ts'+index+val+'class').focus()
                })
            }, 200)
        },
        getBxqtzyjlList(){
            bxqtzyjlList({fbxdid:this.fromState.fbxdid}).then(res => {
                if(res.success){
                    this.bxqtzyjlList = res.result.records
                }
            })
        },
        // 添加其他报销
        addRecordList(ids){
            bxqtzyjlAdd({fbxdid:this.fromState.fbxdid,fbxdgrjl:ids}).then(res => {
                if(res.success){
                    this.$message.success(res.message)
                    this.getBxqtzyjlList()
                }
            })
        },
        // 删除其他报销
        delRecordList(ids){
            var that = this
            that.$confirm({
                title: '您确定要删除吗?',
                onOk() {
                    bxqtzyjlDelete({id:ids}).then(res => {
                        if(res.success){
                            that.$message.success(res.message)
                            that.getBxqtzyjlList()
                        } else {
                            that.$message.warning(res.message)
                        }
                    })
                },
                onCancel() {},
            })
        },
        editRecordList(item){
            bxqtzyjlEdit({...item,}).then(res => {
                if(res.code == 200){
                    this.editTsItem = ''
                    this.$message.success(res.message)
                    this.getBxqtzyjlList()
                }else{
                    this.$message.warning(res.message)
                }
            })
        },
        serviceFeeBlur(item){
            jcyfybxdupdateBxrymxxx({...item,sqsxid:this.fromState.sqsxid,fbxdid:this.fromState.fbxdid}).then(res=>{
                if(res.code == 200){
                    this.editTsItem = ''
                    this.$message.success(res.message)
                    this.getPersonnelData(this.fromState.fbxdid)
                    this.updateCcbzFuntion()
                }else{
                    this.$message.warning(res.message)
                }
            })

        },
        updateCcbzFuntion(){
            zzrybxdupdateCcbz({bxdid:this.fromState.fbxdid}).then(res => {
                if(res.success){
                    this.getData(this.fromState)
                }
            })
        },
        //交通费用
        cxfsHandleChange(val){
            //console.log(val)
            this.cxfsSyArr = val
        },
        cxfsBlur(val,item){
            //console.log(val,item)
            if(item){
                this.transportationBlur(item,'出行方式')
            }else{
                //console.log('我才触发')
                jcyfybxdbatchSetBxdCxfs(
                    val == '飞机'?{fbxdid:this.fromState.fbxdid,fcsjjtfs:val,fsfgwkbx:'否',fsfgwkdfclff:'否'}:{fbxdid:this.fromState.fbxdid,fcsjjtfs:val}
                    ).then(res=>{
                    if(res.code == 200){
                        this.cxfsKey = Date.now()
                        this.$message.success(res.message)
                        this.getPersonnelData(this.fromState.fbxdid)
                        this.getData(this.fromState)
                    }else{
                        this.$message.warning(res.message)
                    }
                })
            }
        },
        transportationBlur(item,val){
            jcyfybxdupdateBxrymxxx({fbxdid:this.fromState.fbxdid,...item}).then(res=>{
                if(res.code == 200){
                    this.$message.success(res.message)
                    this.getPersonnelData(this.fromState.fbxdid)
                    this.updateCcbzFuntion()
                    if(val == '出行方式'){
                        this.getData(this.fromState)
                    }
                }else{
                    this.$message.warning(res.message)
                }
            })
        },
        time1Change(val,type,ids){
            if(type == '去'){
                this.nkBxJtxcdEdit({fcsjjtwqsrq:val[0]? moment(val[0]).format('YYYY-MM-DD'):'',id:ids})
                this.nkBxJtxcdEdit({fcsjjtwddrq:val[1]? moment(val[1]).format('YYYY-MM-DD'):'',id:ids})
            } else {
                this.nkBxJtxcdEdit({fcsjjtfqsrq:val[0]? moment(val[0]).format('YYYY-MM-DD'):'',id:ids})
                this.nkBxJtxcdEdit({fcsjjtfddrq:val[1]? moment(val[1]).format('YYYY-MM-DD'):'',id:ids})
            }
        },
        //
        addTransfer(item){
            this.$refs.addApplicationForTransferFormRef.visible = true
            this.$refs.addApplicationForTransferFormRef.getData({fbxdid: item.fbxdid,fsqsxid: item.fsqsxid,fsqrid: item.fuserid,fsqrxm: item.realname,fbxdgrjlid: item.fbxdgrid},item.id)
        },
        transportationEditClick(row){
            this.$refs.addApplicationForTransferFormRef.visible = true
            this.$refs.addApplicationForTransferFormRef.upGetData({
                id: row.id,
                fwfqk: row.fwfqk,
                fskdw: row.fskdw,
                fkhyh: row.fkhyh,
                fzh: row.fzh,
                fjexx: row.fjexx,
                fyt: row.fyt
            })

        },
        updatezzsquSuccess(){
            this.transportationTableKey = Date.now()
        },
        getupdatejczt(){
            zzrybxdupdatejczt({fbxdid:this.fromState.fbxdid}).then(res => {
                if(res.success){
                    this.getPersonnelData(this.fromState.fbxdid)
                }
            })
        },
        transportationDeleteClick(row){
            let that = this
            this.$confirm({
                title:'您确认删除当条转账单吗？',
                onOk() {
                    zzrybxdDeletzzsq({id:row.id}).then(res=>{
                        if(res.code == 200){
                            that.$message.success(res.message)
                            that.transportationTableKey = Date.now()
                        }else{
                            that.$message.warning(res.message)
                        }
                    })
                }
            })
        },
        //汇总
        summaryActiveChange(val){
            //console.log(val)
        },
        transportationActiveChange(val){
            //console.log(val)
            if(val == '交通费填写'){
                this.getPersonnelData(this.fromState.fbxdid)
                this.updateCcbzFuntion()
                this.getData(this.fromState)
            }
            if(val == '飞机票转账单'){
                this.transportationTableConfig.paramet.fbxdid = this.fromState.fbxdid
                this.transportationTableKey = Date.now()
            }
        },
        // 制度pdf
        systemPff(){
            this.spinning = true
            //console.log('制度pdf',bootConfig[process.env.NODE_ENV].locality_ApI2+YchConstant.SPZX_OA+'/zzrybxd/downLoadOa')
            this.iframeDataKey = Date.now()
            this.iframeSrc = bootConfig[process.env.NODE_ENV].locality_ApI2+YchConstant.SPZX_OA+'/zzrybxd/downLoadOa'
            this.tableVisible = true
            this.spinning = false
            // zzrybxdPreviewfj().then(res => {
            //     if(res.success){
            //         window.open(
            //             bootConfig[process.env.NODE_ENV].locality_ApI2+YchConstant.SPZX_OA+'/zzrybxd/downLoadOa'
            //         )
            //         this.iframeDataKey = Date.now()
            //         this.iframeSrc = res.result.wordUrl
            //         this.tableVisible = true
            //     } else {
            //         this.iframeSrc = null
            //     }
            // })
        },
        // 汇总天数
        returnDayNum(val){
            let str = val;
            let startIndex = str.indexOf("共") + 1
            let endIndex = str.indexOf('天');
            let str3 = str.substring(startIndex, endIndex)
            return str3
        },
        getNameList(list){
            let str = ''
            list.forEach(item => {
                str = str + item.realname + ' '
            })
            return str
        },
        amountInWords(str,val){
            //console.log('总计金额拿到了吗',str,val)
            let str1 = str
            if(str1.indexOf(val) !== -1){
                let str2 = str1.indexOf(val) - 1
                let str3 = str1.substr(str2, 1)
                //console.log('总计金额(大写)',str2,str3)
                return str3
            } else {
                if(val == '角' || val == '分' || str1.indexOf('整') !== -1){
                    return '零'
                }
                return '⨂'
            }
        },
        // 签名图片
        getQmImg(ids){
            // downMyQm({id:ids}).then(resa => {
            //     if(resa.code){
            //         return false
            //     } else {
            //         return "data:image/png;base64," +
            //         btoa( new Uint8Array(resa).reduce( (data, byte) => data + String.fromCharCode(byte), "" ))
            //     }
            // })
            // //console.log('ID---',ids)
            // // if(ids){
            //     let str = null
            //     await this.processItemsInOrder(ids).then(results => {
            //         //console.log('所有操作完成:',str,ids,results);
            //         str = results
            //     }).catch(error => {
            //         console.error('出现错误:',str,ids,error);
            //         str = null
            //     })
            //     //console.log('不得？？？',ids,str)
            //     return str
            // } else {
            //     //console.log('没有id啊！！！',ids)
            //     return null
            // }
            let url = null
            this.qmImgList.forEach(item => {
                if(ids == item.userid){
                    // //console.log('匹配成功',item)
                    url = item.url
                }
            })
            return url

        },
        processItemsInOrder(ids) {
            let chain = Promise.resolve();
            chain = chain.then(() => this.asyncOperation(ids));
            return chain;
        },
        asyncOperation(ids){
            return new Promise((resolve, reject) => {
                // 异步操作
                downMyQm({id:ids}).then(res=>{
                    if(res.code){
                        resolve(null)
                    } else {
                        resolve("data:image/png;base64," +
                        btoa( new Uint8Array(res).reduce( (data, byte) => data + String.fromCharCode(byte), "" )))
                    }
                })
            });
        },
        getPersonList(){
            getSpuser({bxdid: this.fromState.fbxdid}).then(res => {
                //console.log(res)
                // this.qmManList = res.result
                if(res.result.length){
                    res.result.forEach(async item => {
                        let resa = await getMoreUserSignLinkList({ids:item.userid})
                        if(resa.success && resa.result.length){
                            if(resa.result[0].signLink == ''){
                                // //console.log('没有获得图片 signLink == 0')
                                this.qmImgList.push({
                                    ...item,
                                    url: null
                                })
                            } else {
                                this.qmImgList.push({
                                    ...item,
                                    url: resa.result[0].signLink+'&aa='+Date.now()
                                })
                                // //console.log('获得的签名图片列表',this.qmImgList)
                            }
                        }
                    })
                    //console.log('获得的签名图片列表',this.qmImgList)
                }
            })
        },
        previewClick(val){
            //console.log(val)
            let data = {
                bxdid: this.fromState.fbxdid,
                sqsxid: val.id
            }
            zzrybxdgetYlsj(data).then(res => {
                if(res.success){
                    //console.log(this.$refs.oaModalRef)
                    this.$refs.oaModalRef.reviseClick(res.result.records)
                } else {
                    this.$message.warning(res.message)
                }
            })
        },
        saveSpecial(item){//保存特殊事项
            let data = {
                fbxdid:this.fromState.fbxdid,
                ...item,
            }
            jcyfybxdupdateFybxdTssxSq(data).then(res=>{
                if(res.code == 200){
                    this.$message.success(res.message)
                    this.getAllSpecial()
                }else{
                    this.$message.warning(res.message)
                }
            })
        },
        overdueReimbursementClick(item){
                this.$refs.selectApplicantRef.getData({item,idArr:item.fewfybxsqrid?item.fewfybxsqrid.split(','):[],val:1,fbxdid:this.fromState.fbxdid})
                this.$refs.selectApplicantRef.visible = true

        },
        noonBreakClick(item){
            this.$refs.selectApplicantRef.getData({item,idArr:item.fwxfsqrid?item.fwxfsqrid.split(','):[],val:2,fbxdid:this.fromState.fbxdid})
            this.$refs.selectApplicantRef.visible = true

        },
        getApplicantData(row){
            //console.log(row)
            var data = {}
            if(row.val == 1){
                data = {
                    id:row.id,
                    fewfybxsqrid:row.id,
                    fewfybxsqrxm:row.name,
                }
            }else{
                data = {
                    id:row.id,
                    fwxfsqrid:row.id,
                    fwxfsqrxm:row.name,
                }
            }
            this.saveSpecial(data)
        },
        //底部按钮
        saveClick(val,ztVal,fqVal){//保存
            //console.log(val,ztVal)
            let data = {
                ...this.fromState,
                id:this.fromState.fbxdid,
            }
            if(this.currentSteps == 6 && ztVal == '下一步'){
                this.messaageSaveClick(data)
                return
            }
            if(this.currentSteps == 1 && ztVal !== '上一步'){
                data.fsfytssxsq = this.isSpecial
            }
            jcyfybxdupdateBxd(data).then(res=>{
                if(res.code == 200){
                    if(val){
                        this.$message.success(res.message)
                    }
                    if(ztVal == '下一步'){
                        this.nextStepClick(fqVal)
                    }else if(ztVal == '上一步'){
                        this.backStepClick()
                    }else{
                        this.getData(this.fromState)
                    }
                }else{
                    this.$message.warning(res.message)
                }
            })
        },
        // 完成前提示
        messaageSaveClick(data){
            var that = this
            that.$confirm({
                title: '点击完成按钮后，所形成的表单数据将不可更改，您确认要继续提交吗?',
                onOk() {
                    jcyfybxdupdateBxd(data).then(res=>{
                        if(res.code == 200){
                            that.$message.success(res.message)
                            that.nextStepClick(true)
                        }else{
                            that.$message.warning(res.message)
                        }
                    })
                },
                onCancel() {
                    //console.log('Cancel');
                },
            });
        },
        backStepClick(){//上一步
            jcyfybxdreturnFybxd({fbxdid:this.fromState.fbxdid}).then(res=>{
                if(res.code == 200){
                    this.$message.success(res.message)
                    this.getData(this.fromState)
                }else{
                    this.$message.warning(res.message)
                }
            })
        },
        nextStepClick(val){//下一步
            jcyfybxdsubmitFybxd({fbxdid:this.fromState.fbxdid}).then(async res=>{
                if(res.code == 200){
                    this.$message.success(res.message)
                    if(this.currentSteps == 5){
                       await zzrybxdupdategrje({bxdid:this.fromState.fbxdid})
                       await zzrybxdgethzdByBxd({bxdid:this.fromState.fbxdid})
                    }
                    this.getData(this.fromState)
                    if(val){
                        this.InitiateProcess()
                    }
                }else{
                    this.$message.warning(res.message)
                }
            })
        },
        InitiateProcess(){
            initBzFlow({fsffqlc:'是',id:this.fromState.fbxdid}).then(res => {})
        },
        totalPrintClick(){//打包打印
            // this.$refs.totalPrintRef.getData(this.fromState,this.transportationList,this.allSpecialList,this.expertServicesList,this.expertServicesTotal)
            this.$refs.totalPrintRef.getData(this.fromState,this.previewTableList,this.qmImgList,{transportationList1:this.transportationList1})
            this.$refs.totalPrintRef.visible = true
        },
    }
}
</script>
<style lang="less">
.internalControl-reimbursement-content-box-v{
    .ant-steps-item-content {
        width: 126px;
    }
    .ant-steps-item-title{
        font-weight: 600 !important;
        font-size: 16px;
    }
    .internalControl-reimbursement-model-form-box {
        padding: 0 15px;
        margin-top: 20px;
        .ant-descriptions-bordered .ant-descriptions-item-label{
            font-weight: 600;
            font-size: 16px;
            color: rgba(0, 0, 0, 0.85);
            background-color:#e6f7ff;
            width: 88px !important;
            text-align: right;
            font-family:simHei !important;
        }
        .ant-descriptions-bordered .ant-descriptions-item-label, .ant-descriptions-bordered .ant-descriptions-item-content{
            padding: 5px 10px !important;
            .ant-form-item {
              margin-bottom: 0 !important;
            }
        }
        .descriptions-label-slot{
            display: flex;
            align-items: center;
            width: 95px !important;//确保左侧固定文字不会换行
            justify-content: center;
        }
        .xhText{
            display: inline-block;
            color: #f5222d;
            line-height: 31px;
            padding-right: 2px;
            font-size: 14px;
            font-weight: 600;
            height: 30px;
        }
        .descriptions-item-center{

        }
        .ant-form-inline .ant-form-item-with-help{
            margin-bottom: 0px !important;
        }
        .zm-form-model{
            display: flex;
            .ant-form-item-control-wrapper{
                flex: 1;
            }
        }
        .ant-form-item-control-wrapper{
            font-family:仿宋_GB2312 !important;
        }
        .ant-descriptions-bordered .ant-descriptions-row{
            border-bottom: 1px solid #e4e3e3;
        }
        .ant-descriptions-bordered .ant-descriptions-item-label, .ant-descriptions-bordered .ant-descriptions-item-content{
            border-right: 1px solid #e4e3e3;
        }
        .ant-descriptions-bordered .ant-descriptions-view{
            border: 1px solid #e4e3e3;
            border-right: 0;
        }
        .ant-descriptions-row:last-child{
            border-bottom: 0;
        }

    }
    .internalControl-reimbursement-infoArea-box{
        .special-content-radio{
            height: calc(100vh - 225px);
            display: flex;
            align-items: center;
            // justify-content: center;
            flex-direction: column;
            margin-top: 30px;
            .ant-radio-wrapper{
                font-size: 18px;
            }
            .ant-radio-inner{
                width: 20px;
                height: 20px;
            }
            .ant-radio-inner::after{
                width: 12px;
                height: 12px;
            }
            .special-item-btn-v{
                margin-left: 365px;
                margin-top: 15px;
                text-align: center;
            }
        }
        .fjcts-content-box{
            text-align: center;
            margin: 10px 0;
            display: flex;
            justify-content: center;
            .fjcts-content-v{
                width: 80%;
                padding:10px 0;
                border: 1px solid #d9d9d9;
            }
            .fjcts-content-text{
                display: inline-block;
                width: 305px;
                text-align: right;
                font-size: 16px;
                font-weight: 600;
            }
            .fjcts-content-right{
                display: inline-block;
                width: 230px;
                text-align: left;
            }
        }
        .currentSteps2-table {
            width: 100%;
            table-layout: fixed;
            font-size: 18px;
            text-align: center;
            border: 1px solid #d9d9d9;
            th {
                padding: 5px;
                background: #dee5ed !important;
                color: #000 !important;
            }
            td {
                padding: 5px;
                min-height: 40px !important;
                font-size: 16px;
            }
        }
    }
    .internalControl-reimbursement-serviceFee-table{
        th{
            text-align: center;
            font-size: 16px;
            padding: 3px 5px;
        }
        td{
            text-align: center;
            padding: 3px 5px;
            height: 40px;
            font-size: 16px;
        }
        .serviceFee-icon-text-td{
            width: 120px;
        }
        .serviceFee-icon-text{
            display: flex;
            align-items: center;
            padding: 0 5px;
            .serviceFee-icon{
                color: #5ca3e5;
            }
            span{
                text-align: center;
                flex: 1;
            }
        }

    }
    .internalControl-reimbursement-transportation-table{
        th{
            text-align: center;
            font-size: 16px;
            padding: 3px 5px;
        }
        td{
            text-align: center;
            padding: 3px 5px;
            height: 40px;
            font-size: 16px;
        }
        .special-table-lable-td{
            background-color: #e6f7ff;
            width: 160px !important
        }
    }
    .internalControl-reimbursement-summary-table-5{
        .tabs-card-edit-box{
            margin: 5px 15px 0 15px;
            .ant-tabs-bar{
                // border: 0 !important;
                border-color: #38f !important;
                margin: 0 !important;
            }
            .ant-tabs-tab{
                background: #edeff3 !important;
                font-size: 14px !important;
                margin-left: 1px !important;
                height: 30px !important;
                line-height: 30px !important;

            }
            .ant-tabs-tab-active{
                margin: 0 !important;
                margin-left: 0 !important;
                margin-right: 1px !important;
                background-color: #38f !important;
                color: #fff !important;
                height: 32px !important;
                border: 1px solid #38f !important;
                border-bottom: 0 !important;
                padding:0 15px !important;

            }
            .ant-tabs-nav-container{
                height: 32px !important;
            }
        }
        .tab-box-v1{
            border: 1px solid #38f;
            border-top: 0;
            margin: 0 15px;
            // height: calc((100vh - 260px) / 2 );
            .qmImg {
                width: 100px;
                height: 30px;
            }
        }

        .tabs-card-edit-box2{
            .ant-tabs-tab{
                // margin-right: 5px !important;
                border-bottom-left-radius: 10px !important;
                border-bottom-right-radius: 10px !important;
            }
        }
        .tabs-card-edit-box3{
            .ant-tabs-tab-active{
                background-color: #fff !important;
                color: #38f !important;
            }
        }
        .tabs-card-edit-box4{
            .ant-tabs-tab{
                // margin-right: 5px !important;
                border-top-left-radius: 10px !important;
                border-top-right-radius: 10px !important;
            }
            .ant-tabs-tab-active{
                background-color: #fff !important;
                color: #38f !important;
            }
        }
    }

    //汇总表
    .internalControl-reimbursement-summary-1{
        width: 100%;
        padding: 10px 15px;
        .table-hear{
            display: flex;
            font-weight: 600;
            flex-direction: column;
            h3{
                font-weight: 600;
                font-size: 22px;
                text-align: center;
            }
            span{
                display: inline-block;
                width: calc(100% - 8px);
                text-align: right;
                padding-right: 8px;
            }
        }
        .serviceFee-icon-text-td{
            width: 120px;
        }
        .serviceFee-icon-text{
            display: flex;
            align-items: center;
            padding: 0 5px;
            .serviceFee-icon{
                color: #5ca3e5;
            }
            span{
                text-align: center;
                flex: 1;
            }
        }
        .preview-box {
            width: 60%;
            margin: 0 auto;
        }
    }
    .travelReimbursementForm-print-box {
        font-size: 14px;
        font-family: 宋体;
        color: black;
        h1 {
            text-decoration: underline;
            text-align: center;
            color: #5ca3e5;
        }
        .travelReimbursementForm-table {
            width: 100%;
            text-align: center;
            table-layout: fixed;
            td {
            // min-width: 10px;
            padding: 0 !important;
            }
        }
        table {
            border-color: #5ca3e5;
            border-top: 2px solid #5ca3e5;
            border-left: 2px solid #5ca3e5;
            border-right: 2px solid #5ca3e5;
            border-bottom: 2px solid #5ca3e5;
        }
        h1 {
            color: #5ca3e5;
            font-weight: bold;
            letter-spacing: 4px;
            // font-size: 35px;
        }
        .Title {
            color: #5ca3e5;
            // font-weight: bold;
            text-align: center;
        }
        .letterSpan {
            // letter-spacing: 8px;
        }
        .td-rowspan {
            width: 1px !important;
            min-width: 1px !important;
            padding: 1px 0;
        }
        .travelReimbursementForm-print-title-box {
            display: flex;
            justify-content: space-between;
        }
    }
    .applicationForTransferForm-print-box {
        font-size: 18px;
        font-family: 宋体;
        color: black;
        h1 {
            text-align: center;
        }
        .applicationForTransferForm-table {
            width: 100%;
            text-align: center;
            // table-layout: fixed;
            th {
            padding: 10px 5px !important;
            }
            td {
            min-width: 10px;
            padding: 5px !important;
            }
        }
        table {}
        h1 {
            font-weight: bold;
            letter-spacing: 4px;
            // font-size: 35px;
        }
        .Title {
            color: #5ca3e5;
            // font-weight: bold;
            text-align: center;
        }
        .letterSpan {
            // letter-spacing: 8px;
        }
        .td-rowspan {
            width: 1px !important;
            min-width: 1px !important;
            padding: 1px 0;
        }
    }
}
.fapiao-box {
    width: 300px;
    height: 200px;
    background-image:
        linear-gradient(
            rgb(146, 211, 202) 0%,
            rgb(146, 211, 202) 12%,
            transparent 12%,
            transparent 24%,
            rgb(146, 211, 202) 24%,
            rgb(146, 211, 202) 36%,
            transparent 36%,
            transparent 48%,
            rgb(146, 211, 202) 48%,
            rgb(146, 211, 202) 88%,
            transparent 88%,
            transparent 100%,
        ); /* 35%设置虚线点y轴上的长度 */
    background-position: right; /* right配置右边框位置的虚线 */
    background-size: 1px 20px; /* 第一个参数设置虚线点x轴上的长度；第二个参数设置虚线点的间距 */
    background-repeat: repeat-y;
}
</style>
